Build CNN Website Clone from Scratch- MERN Stack

Build CNN Website Clone from Scratch: MERN Stack, available at $54.99, has an average rating of 3.8, with 71 lectures, based on 5 reviews, and has 111 subscribers.

You will learn about How to build a responsive full-stack web app that can serve as a news portal, similar to the CNN website, using the MERN stack How to create an admin panel to manage your web app’s content and users How to use Mongoose to work with MongoDB and define schemas and models for your data How to use Express to create a server and handle requests and responses How to use React to create a dynamic and interactive front-end with components, hooks, and state management How to implement features such as categories, subcategories, tags, types, live updates, user roles, and support forms for your news portal How to use MongoDB GridFS to store and retrieve files How to use Node js to run JavaScript on the server and use NPM to manage dependencies How to use Mongoose Paginate to implement pagination for your data How to use Socket io to enable real-time communication between the server and the client How to use Express Session to manage user sessions and authentication How to use Multer to handle file uploads and downloads How to use Cors to enable cross-origin resource sharing This course is ideal for individuals who are This course is for anyone who wants to learn how to build a full-stack web app that can serve as a news portal, similar to the CNN website, using the MERN stack. Whether you are a beginner or an intermediate web developer, you will find this course useful and engaging, as it covers both the fundamentals and the advanced topics of web development with MongoDB, Express, React, and Node js. By the end of this course, you will have a functional web app that can display and manage news content It is particularly useful for This course is for anyone who wants to learn how to build a full-stack web app that can serve as a news portal, similar to the CNN website, using the MERN stack. Whether you are a beginner or an intermediate web developer, you will find this course useful and engaging, as it covers both the fundamentals and the advanced topics of web development with MongoDB, Express, React, and Node js. By the end of this course, you will have a functional web app that can display and manage news content.

Enroll now: Build CNN Website Clone from Scratch: MERN Stack

Summary

Title: Build CNN Website Clone from Scratch: MERN Stack

Price: $54.99

Average Rating: 3.8

Number of Lectures: 71

Number of Published Lectures: 71

Number of Curriculum Items: 71

Number of Published Curriculum Objects: 71

Original Price: $54.99

Quality Status: approved

Status: Live

What You Will Learn

How to build a responsive full-stack web app that can serve as a news portal, similar to the CNN website, using the MERN stack

How to create an admin panel to manage your web app’s content and users

How to use Mongoose to work with MongoDB and define schemas and models for your data

How to use Express to create a server and handle requests and responses

How to use React to create a dynamic and interactive front-end with components, hooks, and state management

How to implement features such as categories, subcategories, tags, types, live updates, user roles, and support forms for your news portal

How to use MongoDB GridFS to store and retrieve files

How to use Node js to run JavaScript on the server and use NPM to manage dependencies

How to use Mongoose Paginate to implement pagination for your data

How to use Socket io to enable real-time communication between the server and the client

How to use Express Session to manage user sessions and authentication

How to use Multer to handle file uploads and downloads

How to use Cors to enable cross-origin resource sharing

Who Should Attend

This course is for anyone who wants to learn how to build a full-stack web app that can serve as a news portal, similar to the CNN website, using the MERN stack. Whether you are a beginner or an intermediate web developer, you will find this course useful and engaging, as it covers both the fundamentals and the advanced topics of web development with MongoDB, Express, React, and Node js. By the end of this course, you will have a functional web app that can display and manage news content

Target Audiences

This course is for anyone who wants to learn how to build a full-stack web app that can serve as a news portal, similar to the CNN website, using the MERN stack. Whether you are a beginner or an intermediate web developer, you will find this course useful and engaging, as it covers both the fundamentals and the advanced topics of web development with MongoDB, Express, React, and Node js. By the end of this course, you will have a functional web app that can display and manage news content

This course will teach you how to build a full-stack web app that can serve as a news portal, similar to the CNN website, using the MERN stack, which consists of MongoDB, Express, React, and Node.js. You will learn how to use Mongoose to work with MongoDB, Express to create a server and handle requests, React to create a dynamic and interactive front-end, and Node.js to run JavaScript on the server. You will also learn how to implement features such as categories, tags, live updates, user roles, and support forms. By the end of this course, you will have a functional web app that can display and manage news content on various topics, such as politics, business, sports, entertainment, health, etc.
Create a web app that can serve as a news portal, with features such as:

Categories: a way of organizing the news content into broad topics, such as World, U.S., Business, Technology, etc. Categories can help the users to navigate the news portal and find the content they are interested in. Categories can also have subcategories, such as Asia, Europe, Africa, etc. under World, or Markets, Economy, Personal Finance, etc. under Business.

SubCategory: a way of dividing the news content into more specific topics, such as Asia, Europe, Africa, etc. under World, or Markets, Economy, Personal Finance, etc. under Business. SubCategory can help the users to narrow down their search and find the content they are looking for. SubCategory can also be used to create different sections and menus for the news portal.

Type: a way of categorizing the news content by its format, such as Breaking, General, Live Update, Video, Photo etc. Type can help the users to choose the preferred way of consuming the news content. Type can also be used to display different icons and layouts for the news content.

Tags: a way of labeling the news content with specific keywords, such as Coronavirus, Election, Olympics, etc. Tags can help the users to filter and search the news content by their interests. Tags can also be used to create related articles and suggestions for the users.

Live updates: a way of providing the latest and breaking news to the users in real-time. Live updates can be displayed as banners, tickers, or pop-ups on the news portal. Live updates can also have different types, such as Breaking News, Live Blog, Live Video, etc.

User roles: a way of defining the permissions and access levels for different types of users on the news portal. User roles can include Admin, Editor, Reporter, Subscriber, Guest, etc. User roles can determine what actions the users can perform on the news portal, such as creating, editing, deleting, viewing, commenting, liking, sharing, etc. the news content.

Support forms: a way of collecting feedback, queries, complaints, and suggestions from the users on the news portal. Support forms can help the users to contact the news portal’s team and get assistance or information. Support forms can also help the news portal’s team to improve their service and quality.

Course Curriculum

Chapter 1: Introduction

Lecture 1: Introduction [Same as Intro]

Lecture 2: How MERN Stack Works?

Chapter 2: Setting Up the Development Environment

Lecture 1: Installation of Node.js

Lecture 2: Setting up MongoDB

Lecture 3: Create React App

Lecture 4: Configuring Tailwind

Chapter 3: Desigining Home Page

Lecture 1: Home Component With Header

Lecture 2: Design Header Advertisiment

Lecture 3: Designing Nav Bar

Lecture 4: Design Breaking News

Lecture 5: Design Second News Column

Lecture 6: Completing First Section

Lecture 7: Designing Second Section

Lecture 8: Completion of Second Section

Lecture 9: Designing Fourth Section

Lecture 10: Designing Rest Sections

Lecture 11: Design Footer Search Input Field

Lecture 12: Design Footer Category Row

Lecture 13: Completion of Footer

Lecture 14: Create Article Page

Lecture 15: Completion of Designing Article Page

Chapter 4: Auth System

Lecture 1: Designing Register Page

Lecture 2: Completion of Designing Register Page

Lecture 3: Password Validation

Lecture 4: Create Express Server and Initiate Post Request

Lecture 5: Create Router and Controller

Lecture 6: Connecting to MongoDB Atlas

Lecture 7: Creating User Model

Lecture 8: Writing Controller to Store Registered data

Lecture 9: Validation and Error handling

Lecture 10: Designing Login Page

Lecture 11: Creating Login Backend

Chapter 5: Admin Panel

Lecture 1: User Rights Access Via Express Session

Lecture 2: Designing Admin Panel Sidebar

Lecture 3: Creating Admin Header

Lecture 4: Adding Input Field for Creating News Article 1

Lecture 5: Adding Input Field for Creating News Article 2

Lecture 6: Adding Text Editor

Lecture 7: Previewing Image and Video

Lecture 8: Inserting Category and SubCategory Data

Lecture 9: Feeding Role Tag and Type Data

Lecture 10: Fetch Type Data

Lecture 11: Fetch Category and Subcategory Data

Lecture 12: Adding Conditional Live Update Input field

Lecture 13: Processing news data

Lecture 14: Write controller code to store news Data 1

Lecture 15: Write controller code to store news Data 2

Lecture 16: Create News List

Lecture 17: Delete News

Lecture 18: Update News

Lecture 19: Design Manage Categories

Lecture 20: Display and delete categories

Lecture 21: Add Category and SubCategories

Lecture 22: Managing Tags

Lecture 23: Manage User Roles

Lecture 24: Manage User Account

Lecture 25: Create Settings 1

Lecture 26: Create Settings 2

Lecture 27: Create Support System

Chapter 6: Search

Lecture 1: Enable Search Option

Lecture 2: Creating Search system

Lecture 3: Create method to get searched news

Chapter 7: News Live BroadCast

Lecture 1: Create component for LIve Update

Lecture 2: Adding Socket io to broadcast news 1

Lecture 3: Adding Socket io to broadcast news 2

Chapter 8: Display Dynamic News Data

Lecture 1: Create Component to fetch news data

Lecture 2: Write controller to fetch data with filter

Lecture 3: Display Data in HomePage

Lecture 4: Display Database Data in Article Page

Lecture 5: Display Category Page

Chapter 9: Conclusion

Lecture 1: Congratulation !

Instructors

Km Habib
Web Developer and Certified Data Scientist

Rating Distribution

1 stars: 1 votes

2 stars: 0 votes

3 stars: 1 votes

4 stars: 1 votes

5 stars: 2 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!