Skip to content

Commit 74df902

Browse files
AmbratolmAmbratolm
Ambratolm
authored and
Ambratolm
committed
init
0 parents  commit 74df902

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

88 files changed

+18511
-0
lines changed

‎.gitignore

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
.DS_Store
2+
node_modules
3+
/dist
4+
/database
5+
6+
# local env files
7+
.env.local
8+
.env.*.local
9+
10+
# Log files
11+
npm-debug.log*
12+
yarn-debug.log*
13+
yarn-error.log*
14+
15+
# Editor directories and files
16+
.idea
17+
.vscode
18+
*.suo
19+
*.ntvs*
20+
*.njsproj
21+
*.sln
22+
*.sw?
23+
*.sublime-project
24+
*.sublime-workspace

‎README.md

+151
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,151 @@
1+
# :memo: Amb-Notes
2+
3+
[**:earth_africa: View Demo**](https://amb-notes.herokuapp.com)
4+
5+
Public Notes Sharing Web Application.
6+
7+
<!-- ![amb-notes-screenshot](/screenshot.gif?raw=true "Screenshot of the app") -->
8+
9+
## :book: Table of contents
10+
11+
<!-- toc -->
12+
13+
- [:scroll: Introduction](#scroll-introduction)
14+
- [:checkered_flag: Getting started](#checkered_flag-getting-started)
15+
- [:arrow_forward: Deployment](#arrow_forward-deployment)
16+
- [:octocat: Technologies](#octocat-technologies)
17+
- [:computer: Frontend](#computer-frontend)
18+
- [:crystal_ball: Backend](#crystal_ball-backend)
19+
- [:triangular_ruler: Design](#triangular_ruler-design)
20+
21+
<!-- tocstop -->
22+
23+
## :scroll: Introduction
24+
25+
This is a simple **Web application** that allows users to **post public notes** that others can see on the home page. <br>
26+
It is mainly built with **VueJS** and **ExpressJS**. It implements many **common features** using many **libraries**. <br>
27+
This project can be used for **learning purposes** or as a **starter template** for building similar applications.
28+
29+
## :checkered_flag: Getting started
30+
31+
1. Clone the repository:
32+
33+
```bash
34+
cd somewhere
35+
git clone https://github.com/Ambratolm/amb-notes.git
36+
cd amb-notes
37+
```
38+
39+
2. Install the dependencies:
40+
41+
```bash
42+
npm i
43+
```
44+
45+
3. Install [**Nodemon**](https://github.com/remy/nodemon/) globally:
46+
47+
```bash
48+
npm i -g nodemon
49+
```
50+
51+
4. Run app server:
52+
53+
```bash
54+
npm run serve
55+
```
56+
57+
4. Run api server:
58+
59+
```bash
60+
npm run api
61+
```
62+
63+
## :arrow_forward: Deployment
64+
65+
To deploy the project in a node environment:
66+
67+
1. Push the repository to a node server using a service like [Heroku](https://heroku.com).
68+
69+
2. Install the dependencies:
70+
71+
```bash
72+
npm i
73+
```
74+
75+
3. Build the app:
76+
77+
```bash
78+
npm run build
79+
```
80+
81+
7. Start the app:
82+
83+
```bash
84+
npm start
85+
```
86+
87+
You can also do the same to deploy locally.
88+
89+
## :octocat: Technologies
90+
91+
The initial project was generated using [**Vue CLI**](https://github.com/vuejs/vue-cli) tool.
92+
93+
### :computer: Frontend
94+
95+
This frontend app is mainly powered by Vue and its integrated packages:
96+
97+
| Library | Use |
98+
| :---------------------------------------------------- | :--------------------------- |
99+
| [**VueJS**](https://github.com/vuejs/vue) | Main JS framework |
100+
| [**Vue Router**](https://github.com/vuejs/vue-router) | Routing |
101+
| [**Vuex**](https://github.com/vuejs/vuex) | Centralized state management |
102+
103+
The **GUI** is powered by:
104+
105+
| Library | Use |
106+
| :------------------------------------------------------------ | :------------------ |
107+
| [**Bulma**](https://github.com/jgthms/bulma) | Main CSS framework |
108+
| [**Buefy**](https://github.com/buefy/buefy) | Bulma UI components |
109+
| [**Bulmaswatch**](https://github.com/jenil/bulmaswatch) | Bulma themes |
110+
| [**FontAwesome**](https://github.com/FortAwesome/FontAwesome) | Icons |
111+
| [**AnimateCSS**](https://github.com/daneden/animate.css) | CSS animations |
112+
113+
The frontend app is using these **utilities**:
114+
115+
| Library | Use |
116+
| :----------------------------------------------------------------- | :----------------------------- |
117+
| [**Axios**](https://github.com/axios/axios) | AJAX calls |
118+
| [**Vue Meta**](https://github.com/nuxt/vue-meta) | HTML metadata |
119+
| [**Moment**](https://github.com/moment/moment/)/ | Dates format |
120+
| [**Vue Moment**](https://github.com/brockpetrie/vue-moment) | Moment pipes |
121+
| [**VeeValidate**](https://github.com/logaretm/vee-validate) | Form validation |
122+
| [**VuexPersist**](https://github.com/championswimmer/vuex-persist) | Data persistence |
123+
| [**Lodash**](https://github.com/lodash/lodash) | Common and array related tasks |
124+
125+
### :crystal_ball: Backend
126+
127+
The backend **API** and **Database** (_Using [file system](https://nodejs.org/api/fs.html) for the moment_) are powered by:
128+
129+
| Library | Use |
130+
| :-------------------------------------------------- | :--------------------- |
131+
| [**Node**](https://github.com/nodejs/node) | JS runtime |
132+
| [**Express**](https://github.com/expressjs/express) | Main Node JS framework |
133+
134+
The backend app is using these **utilities**:
135+
136+
| Library | Use |
137+
| :--------------------------------------------------------------------- | :------------------------- |
138+
| [**Lodash**](https://github.com/lodash/lodash) | Arrays data querying |
139+
| [**Joi**](https://github.com/hapijs/joi) | Data validation |
140+
| [**JsonWebToken**](https://github.com/auth0/node-jsonwebtoken) | Authentication |
141+
| [**Uuid**](https://github.com/uuidjs/uuid) | IDs generation |
142+
| [**BcryptJS**](https://github.com/dcodeIO/bcrypt.js) | Password hashes generation |
143+
| [**CommonErrors**](https://github.com/shutterstock/node-common-errors) | Errors classes |
144+
| [**Colors**](https://github.com/Marak/colors.js) | Console colorations |
145+
| [**Faker**](https://github.com/marak/Faker.js) | Mock test data generation |
146+
147+
## :triangular_ruler: Design
148+
149+
- :paperclip: [Models](/docs/models.md)
150+
- :paperclip: [Features](/docs/features.md)
151+
- :paperclip: [ToDos](/docs/todos.md)

‎babel.config.js

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
module.exports = {
2+
presets: ["@vue/cli-plugin-babel/preset"]
3+
};

‎docs/features.md

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
### Email-Authentication
2+
3+
| Actor | Feature |
4+
| :------ | :------------------------------------------------------- |
5+
| visitor | register new **user** account |
6+
| visitor | log in to own **user** account |
7+
| user | log out from own **user** account |
8+
| user | edit own **user** account data (email, password, ...etc) |
9+
10+
### Notes-Feed
11+
12+
| Actor | Feature |
13+
| :------ | :---------------------------------- |
14+
| visitor | view all **notes** |
15+
| user | post, edit and remove own **notes** |
16+
17+
### User-Profile
18+
19+
| Actor | Feature |
20+
| :---- | :---------------------------------------------------- |
21+
| user | own **user** profile page that shows own **notes** |
22+
| user | view other **users** profiles |
23+
| user | edit own **user** profile data (name, avatar, ...etc) |

‎docs/models.md

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
# User
2+
3+
| Name | Type | Rules |
4+
| :---------- | :--- | :--------------------------------: |
5+
| id | text | :key: **primary-key**, auto |
6+
| email | text | **required-unique**, format: email |
7+
| password | text | **required**, length: 8-80 |
8+
| name | text | **required-unique**, length: 3-30 |
9+
| description | text | length: 0-100 |
10+
| avatar | text | format: url |
11+
| role | text | values: ["", "admin"] |
12+
13+
# Note
14+
15+
| Name | Type | Rules |
16+
| :------ | :--- | :---------------------------- |
17+
| id | text | :key: **primary-key**, auto |
18+
| userId | text | :key: **foreign-key: user** |
19+
| title | text | **required**, length: 3-30 |
20+
| content | text | **required**, length: 10-1000 |

‎docs/todos.md

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
# TODO
2+
3+
## Access-Token
4+
5+
- [x] **Token Expiration:** Handle Access Token Expiration on Client
6+
- [ ] **Token Storing:** Use a more secured way to persist access token than local storage (cookies? refresh tokens?)
7+
8+
## New-Features
9+
10+
- [ ] **Email Confirmation:** Send email & Make confirmation route
11+
- [ ] **Image Uploading:** Upload user avatar image (instead of URL only)
12+
13+
## Bugs-Fix
14+
15+
- [ ] **Case Sensitivity:** Data querying is case sensitive. For example, a user with an uppercase name won't be found when accessing his profile from the address bar with lowercase input

0 commit comments

Comments
 (0)