All Projects → jeffersonRibeiro → react-nodejs-mongodb-crud

jeffersonRibeiro / react-nodejs-mongodb-crud

Licence: MIT license
👨‍💻 Fullstack web app built with MongoDB, NodeJs, React and Redux. Features: Protected routes client/server side, MaterialUI layout

Programming Languages

javascript
184084 projects - #8 most used programming language
HTML
75241 projects
CSS
56736 projects

Projects that are alternatives of or similar to react-nodejs-mongodb-crud

Node Express Mongoose Passport Jwt Rest Api Auth
Node, express, mongoose, passport and JWT REST API authentication example
Stars: ✭ 146 (+60.44%)
Mutual labels:  mongoose, jwt-authentication, restful-api
Nodejs Rest Api Project Structure Express
Nodejs project structure practices for building RESTful APIs using Express framework and MongoDB.
Stars: ✭ 134 (+47.25%)
Mutual labels:  mongoose, jwt-authentication, restful-api
gorest
Go RESTful API starter kit with Gin, JWT, GORM (MySQL, PostgreSQL, SQLite), Redis, Mongo, 2FA, email verification, password recovery
Stars: ✭ 135 (+48.35%)
Mutual labels:  jwt-authentication, restful-api
arc
Fullstack open source Invoicing application made with MongoDB, Express, React & Nodejs (MERN)
Stars: ✭ 1,291 (+1318.68%)
Mutual labels:  mongoose, jwt-authentication
nestjs-rest-sample
NestJS RESTful APIs Sample
Stars: ✭ 204 (+124.18%)
Mutual labels:  mongoose, restful-api
dhan-gaadi
A complete online bus reservation system (Node, React, Mongo, NextJS, ReactNative)
Stars: ✭ 207 (+127.47%)
Mutual labels:  mongoose, restful-api
restgoose
Model-driven REST API framework using decorators
Stars: ✭ 28 (-69.23%)
Mutual labels:  mongoose, restful-api
TvrboReact
Dream starter project: React, Redux, React Router, Webpack
Stars: ✭ 13 (-85.71%)
Mutual labels:  mongoose, jwt-authentication
peasy-js-samples
Showcases business logic built with peasy-js and consumed by multiple clients
Stars: ✭ 19 (-79.12%)
Mutual labels:  spa, restful-api
Auth-using-Vuejs-express-jwt-nodejs
Login and signup form and authentication using Vue.js, express, mongodb, JWT and bootstrap-vue
Stars: ✭ 17 (-81.32%)
Mutual labels:  mongoose, jwt-authentication
pothole detection
By using this app users can report the potholes on road by clicking a photo via our app and if a pothole is detected by Machine Learning modal then it is saved to our Database from where officials can view the specifics like location,reported by and official can resolve the request.User are notified by email for every update regarding their request
Stars: ✭ 17 (-81.32%)
Mutual labels:  mongoose, jwt-authentication
NodeScalableArchitecture
A Scalable Node Architecture/Server. This repository contains a complete implementation of writing scalable nodejs server/architecture on my medium blog.
Stars: ✭ 62 (-31.87%)
Mutual labels:  mongoose, jwt-authentication
laravel-vue-spa-boilerplate
Laravel Vue Spa BoilerPlate
Stars: ✭ 36 (-60.44%)
Mutual labels:  spa, jwt-authentication
Go Vue Starter
Starter project - Golang api, Vue.js client with user management and jwt authentication
Stars: ✭ 176 (+93.41%)
Mutual labels:  spa, jwt-authentication
Pharmacy-Mangment-System
👨‍💻 🏥 MEAN stack Pharmacy Management system.
Stars: ✭ 229 (+151.65%)
Mutual labels:  mongoose, jwt-authentication
Laravel Vue Starter
Well Documented Laravel Starter App From Development to Production. For Full Blown RESTFUL API and SPA with Beautiful UI Using Buefy / ElementUi For Reusable Vue Components
Stars: ✭ 76 (-16.48%)
Mutual labels:  spa, jwt-authentication
node-server-template
This is Node.js server tidy template / boilerplate with Express (with asyncified handlers, custom error handler) framework and MongoDb. The server use ES6 and above. On different branches you can see different techniques' and technologies' usage, such as Kafka, nodemailer, file download... You also can find postman collections.
Stars: ✭ 116 (+27.47%)
Mutual labels:  mongoose, restful-api
node-mongodb-graphql-starter
A boilerplate for Node.js, MongoDB & GraphQL applications.
Stars: ✭ 56 (-38.46%)
Mutual labels:  mongoose, jwt-authentication
Nestjs Mongoose Crud
Nest.js crud module for mongoose models without `nestjsx/crud`
Stars: ✭ 164 (+80.22%)
Mutual labels:  mongoose, restful-api
Sinn Server
an node server for sinn,that based on of nodejs,koa2,mongoose,docker,nginx,es6/7,Resful API,阿里云 http://servertest.boyagirl.com/
Stars: ✭ 228 (+150.55%)
Mutual labels:  mongoose, restful-api

Aplicação fullstack utilizando MongoDB, NodeJs, React e Redux


Backend features

O banco de dados Mongo foi hospedado no MLab por conveniência. Foi implementado gravatar para foto de perfil, se o email do usuário tiver um avatar no wordpress ela automaticamente é salva no banco. Rotas sensíveis foram protegidas por meio de JWT em conjunto com passport.

Usando

  • Nodejs
    • Express
    • Nodemon - Para restartar o server sempre que houver uma alteração
    • Passport - Para proteger rotas privadas
    • Jwt - Para proteger rotas privadas
    • Bcrypt - Para Cryptografar as senhas de usuários antes de salvar no banco
  • MongoDB
    • Mongoose

Frontend features

Foi usado React em conjunto com Redux e React-router para construir a SPA. Rotas protegidas redirecionam para a home e só são acessíveis por meio de auth. Localstorage foi utilizado para persistir o state de usuário no recarregamento das páginas.

Usando

  • React
    • Redux - Para gerenciar o state da aplicação
    • asyncRoutes - As rotas carregam em chunks, dessa forma evita da aplicação ficar pesada num primeiro carregamento
  • Axios - Para fazer as requisições HTTP
  • Local storage nativo - Para persistir o state e o auth nas rotas privadas
  • MaterialUI components

Como iniciar a aplicação

Requerimentos

  • Node.js
  • NPM

Instalando os pacotes

Execute o comando abaixo para instalar as dependências:

npm install

Iniciando o servidor

Execute o comando abaixo para iniciar o Nodejs e conectar ao banco de dados MongoDB:

npm run server

Aguarde a execução e a API estará rodando na Url http://localhost:8001/api/

Os endpoints disponíveis são:

  • Post - Login more
  • Post - Register more
  • Put - Update Profile more
  • Del - Delete Account more
  • Get - List Users more

A documentação completa pode ser encontrada no Postman

Deixe o servidor rodando em um terminal, abra outro e siga para o próximo passo:

Iniciando a SPA React

Para isso basta executar o comando abaixo, e pronto! :D

npm start

A aplicação irá iniciar automaticamente no browser na Url http://localhost:3000


Copyright and license

The MIT License (MIT). Please see License File for more information.



A little project by Jefferson Ribeiro

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].