Learn how to use the MERN stack (MongoDB, Express.js, React, and Node) to build five fully functioning web apps for dating, video sharing, messaging, and social media. While creating these web apps, you’ll learn key development concepts including how to use React hooks, Redux, MongoDB, Express, Heroku, Firebase, Material UI, and Google authentication. By expanding your portfolio with the projects you create, you will be well equipped as front-end developer.
You will first create a dating site with a swiping feature and chat functionality. You will then build a video sharing app with videos displaying vertically. Next, you will learn to build an awesome messaging web app. Users will be able to chat in real time, as well as log in to their account using Google authentication. You will also create a photo sharing app and social media web apps with the ability to post images with captions and log in using email and password authentication.
Most MERN tutorials out there today cover basic web apps but it is capable of so much more – learn how to use this stack to its full potential and build projects that can be converted into full scaled start-ups with additional features.
What You'll Learn
Work with React hooks and React router
Examine powerful MongoDB services for easy to use and setup
Create routes using Node and host on Heroku
Study different authentication techniques
Deploy all sites using simple Firebase hosting
Use the powerful React ecosystem to add functionalities to your apps
Who This book Is For
Those who have just started their career in web development and have basic knowledge of the core web technologies: HTML, CSS, and JavaScript. Those with basic React development and feel ready to explore its capabilities further.
AI Reading Assistant
Whole-book reading guide from stratified index samples; jump to passages in the text
Tip the Site
Support this siteYour recognition and a small knowledge-service contribution help keep this technical work open source.Scan the WeChat Pay or Alipay code below. Logged-in and guest visitors can both tip.
WeChat Pay
Alipay
Open WeChat or Alipay and scan. No login required.
Brief outline
【One-Line Pitch】
Learn how to use the MERN stack (MongoDB, Express.js, React, and Node) to build five fully functioning web apps for d…
【Book Arc】
- **Opening (~0%–12%)**: By expanding your portfolio with the projects you create, you will be well equipped as front-end developer.; any address is: 1 New York Plaza, New York, NY 10004, U.S.A.
- **Early (~12%–35%)**: ku 16 Deploying the Front End to Firebase 23 Install Node.; 16 Deploying the Front End to Firebase 23 Install Node.
- **Middle (~35%–65%)**: next screen, select the Free tier , as seen in Figure 1-10 .; ess the spacebar to select it, and then press the Enter key.
- **Late (~65%–88%)**: t takes any data from the user and sends it to the database.; ward with the POST request, you need to complete two things.
- **Ending (~88%–100%)**: Click {e setLiked(true)} / } p {liked ?; The front end is complete, and it’s time to start the back end.
【Key Takeaways】
- **By expanding your port…** (Opening): By expanding your portfolio with the projects you create, you will be well equipped as front-end developer.
- **any address is** (Opening): any address is: 1 New York Plaza, New York, NY 10004, U.S.A.
- **oku 16 Deploying the F…** (Opening): oku 16 Deploying the Front End to Firebase 23 Install Node.
- **ku 16 Deploying the Fr…** (Early): ku 16 Deploying the Front End to Firebase 23 Install Node.
- **16 Deploying the Front…** (Early): 16 Deploying the Front End to Firebase 23 Install Node.
- **6 Deploying the Front…** (Early): 6 Deploying the Front End to Firebase 23 Install Node.
【Reading Tips】
- Use Passage locations below to jump into the text and set reading anchors
- If this is a brief outline, click Regenerate (top right) for a synthesized guide
【Coverage Limits】
Compressed outline without the model (~44 index chunks). Full structured guide needs AI available.
Excerpt 1
further. Cover Book cover of MERN Projects for Beginners MERN Projects for Beginners Nabendu Biswas MERN Projects for Beginners Create Five Social Web Apps U...
172 Creating a Header Component 172 Creating a Post Component 173 Making Components Dynamic 177 Firebase Authentication Setup 180 Creating a Modal for Signup...
hat you use the installation location shown in Figure 1-34 . Figure 1-34 Installation location The wizard asks you to choose a package. Keep the defaults , a...
In this chapter, we have created a dating app in MERN stack. We build the frontend in ReactJS and hosted it in Firebase. The backend was build in NodeJS and...
e video. Create two files— VideoSidebar.js and VideoSidebar.css —inside the components folder. You also need to include the Video.js file.The updated code is...
you need to create a database user and give network access. The process is the same as explained in Chapter 1 . Follow those instructions, and then get the
Support this siteYour recognition and a small knowledge-service contribution help keep this technical work open source.
Scan the WeChat Pay or Alipay code below. Logged-in and guest visitors can both tip.
WeChat PayAlipay
Open WeChat or Alipay and scan. No login required.
Add Tag
Enter tag name (max 50 characters)
Share E-Book
MERN Projects for Beginners Create Five Social Web Apps Using MongoDB, Express.js, React, and Node (Nabendu Biswas)（Z-Library）
Scan QR code with your phone to access
Copy the link or scan the QR code to access this e-book on your phone
Share E-Book via Email
Please enter email address
Donation Statistics
¥.00
Total Donations
0
Donation Count
MERN Projects for Beginners Create Five Social Web Apps Using MongoDB, Express.js, React, and Node (Nabendu Biswas)（Z-Library）
Find Your Favorite Books
Only registered users can comment after logging in. Comments need to be reviewed by administrators before being displayed
Loading comments...
Reply to Comment
Edit Comment