Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/kaplanh/mernstack_block-app
Blog App - Mern Stack Application.
https://github.com/kaplanh/mernstack_block-app
css3 database express formik-yup html5 js mongodb mui-material nodejs react-router reactjs redux-persist redux-toolkit
Last synced: 3 days ago
JSON representation
Blog App - Mern Stack Application.
- Host: GitHub
- URL: https://github.com/kaplanh/mernstack_block-app
- Owner: kaplanh
- Created: 2023-11-23T12:34:48.000Z (12 months ago)
- Default Branch: master
- Last Pushed: 2023-12-22T13:40:16.000Z (11 months ago)
- Last Synced: 2023-12-23T01:28:05.095Z (11 months ago)
- Topics: css3, database, express, formik-yup, html5, js, mongodb, mui-material, nodejs, react-router, reactjs, redux-persist, redux-toolkit
- Language: JavaScript
- Homepage: https://mern-stack-block-app-v1.vercel.app/
- Size: 5.34 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Mern Stack Blog App
What's used in this app ?
How to run ?
Author
Once you clone the project
1) chnage directory `cd server` and run `npm install` or `yarn install` for node modules
2) run `nodemon` or `yarn start` to run server
3) chnage directory `cd client` and run `pnpm install` or `yarn install` for node modules
4) run `pnpm run dev` or `yarn run dev` for open development stage
What is this project about ?
The goal was to construct a blog post management system using Node.js and Express for the backend, with MongoDB serving as the database. JWT tokens were utilized to enhance security during user authentication processes, including registration and login functionalities. On the frontend, powered by React, the Material-UI library was seamlessly integrated to ensure a visually engaging and user-friendly design. React-Router played a pivotal role in enabling smooth page transitions, while the strategic use of Formik and Yup libraries streamlined form structuring and validation processes. The integration of React-Toastify further enriched user interactions by providing informative notifications. This project highlighted my proficiency in a comprehensive tech stack, encompassing Node.js, Express, MongoDB, React, Material-UI, JWT tokens, React-Router, Formik, and Yup, contributing to the successful development of an efficient and secure blog post management system.
How does my project look and Relational database management system
[Live Link](https://mern-stack-block-app-v1.vercel.app/)
Feedback and Collaboration
I value your feedback and suggestions. If you have any comments, questions, or ideas for improvement regarding this project or any of my other projects, please don't hesitate to reach out.
I'm always open to collaboration and welcome the opportunity to work on exciting projects together.
Thank you for visiting my project. I hope you have a wonderful experience exploring it, and I look forward to connecting with you soon!
## Project Skeleton
```
Blog App (folder)
|
|---- README.md
|
├── client
| ├── public
| ├── src
| | ├── app
| | ├── components
| | ├── features
| | ├── helper
| | ├── hooks
| | ├── img
| | ├── pages
| | ├── router
| | ├── styles
| | ├── App.jsx
| | ├── index.css
| | └── main.jsx
| |
| ├── .env_example
| ├── .eslintrc.cjs
| ├── .gitignore
| ├── index.html
| ├── package.json
| ├── pnpm-lock.yaml
| ├── vercel.json
| └── vite.config.js
|
├── server
| ├── src
| | ├── configs
| | ├── controllers
| | ├── helpers
| | ├── middlewares
| | ├── models
| | └── routes
| |
| ├── .gitignore
| ├── blog app.png
| ├── index.js
| ├── package-lock.json
| ├── package.json
| ├── readme.md
| ├── vercel.json
| └── yarn.lock
|
└── README.md
```