This guide consists of 3 parts Using React, Node.js, Express & MongoDB you’ll learn how to build a Full Stack MERN Project - from start to finish. The App is called “Memories” and it is a simple social media MERN application that allows users to post interesting events that happened in their lives.
📚 Materials/References:
GitHub Code (feel free to give it a star ⭐): https://github.com/adrianhajdin/project_mern_memories
HTTP status codes: https://www.restapitutorial.com/httpstatuscodes.html
MongoDB Atlas: https://www.mongodb.com/cloud/atlas
MemDev: https://mem.dev/
Styles Files: https://gist.github.com/adrianhajdin/d99aaa67124f0de7667fd3937715fb26
Image: http://bit.ly/memories_image
Subscribe: https://www.youtube.com/channel/UCmXmlB4-HJytD7wek0Uo97A
1: Full Stack MERN Project - Build and Deploy an App | React + Redux, Node, Express, MongoDB [Part 1]
Chapters:
00:00 Intro + Demo
02:28 Backend Setup
06:18 Frontend Setup
8:46 index.js Setup
10:21 MongoDB Setup
12:01 Connecting to the Database
15:45 Routing
18:40 Backend Folder Structure
23:39 Controllers
28:50 JSX Structure
36:58 Styling
42:01 Redux!
57:07 Form
1:09:05 Create a Post
1:13:23 MERN
2: Full Stack MERN Project - Build and Deploy an App | React + Redux, Node, Express, MongoDB [Part 2]
This video is the second part of a two-part series where you’ll learn React, Node.js, Express & MongoDB. You’ll also learn how to build a Full Stack MERN Project - from start to finish. The App is called “Memories” and it is a simple social media MERN application that allows users to post interesting events that happened in their lives.
Chapters
00:00 Intro
01:27 Posts
12:52 Update Functionality
34:33 Debugging
37:28 Delete Functionality
44:47 Like Functionality
51:14 Additional Fixes
55:40 Mobile Responsiveness
1:00:48 Action Constants
1:06:40 Environmental Variables
1:10:58 Deployment
3: MERN Auth - Login with Email (JWT) + Google OAuth Authentication | React, Node, Express, MongoDB [Part 3 ]
Using React, Node.js, Express & MongoDB in previous videos you’ve learned how to build a Full Stack MERN Project. In this video, we’re going to add Authentication! Auth is a complex process, it means allowing users to register and log in. Today, you’re going to learn it completely. Email login using JWT, OAuth Google login, and much more. Enjoy!
Chapters:
00:00:00 Intro
00:03:52 Layout
00:25:54 Auth Form
00:48:53 Google OAuth
01:16:24 JWT Login
01:26:50 JWT Auth Backend
01:43:36 Auth Middleware
01:56:57 JWT Login Frontend
02:07:55 User Actions
02:21:09 Like, delete & edit
02:27:58 Token Expiry
02:32:09 Deployment
#react #javascript #node #mongodb #express
