BULLETIN BOARD is full stack application to adding announcement. This project was bootstrapped with Create React App. Project is divided into front-end and back-end parts. Front-end was build based on React with Redux and Material-UI. Back-end was build with Express & MongoDB.
http://olx.webster2020.usermd.net/
- git clone git@github.com:Webster2020/BULLETIN_BOARD.git
- yarn install
- yarn start - run the project and than You can see it on Your device
*...or use link if You only want to check how it works
- React with Hooks - as main library
- Redux - store
- Material-UI - for building most of components and styling
- SCSS - for additional styling
- React Router - for routing
- React Thunk - for fetching data
- Eslint - to control bugs
- Husky - to control bugs before every commit
- Lint Staged - to check only changed files
- Express - server
- MognoDB & Mongoose - database
Application's front-end is divided into few views, main views: Homepage, Post, PostAdd and PostEdit.
- Homepage:
- bar with buttons: if user logout: login and register, if user login: logout and myposts
- list of posts
- button to adding post
- Post:
- information about post
- if user login and user is post's author: buttons to edit and delete post
- PostAdd:
- form with inputs
- PostEdit:
- form with inputs
- preview of the edited post Application's back-end is built with server.js, routes with routes.js files and models with model.js files
- Server
- endpoints and connect with mongo database
- Routes
- endpoints
- Models
- schemes database collections
Project is not divided into components in accordance with the React convention.
- components with JS, JSX and SCSS
- root file: index.html
- store and reducers in redux folder
- others functions in utils
- configuration files: gitignore, package.json, etc.
- data with mongo
- server with express
Project was prepared based on my own idea and using my current knowledge and skills.
- Refactor code
- Login / Register forms validation
- Michal Szwajgier - Webster2020 -
Free licence