HOME > Development > Build a Travel Blog App with React and Chakra UI MERN [2023]

Build a Travel Blog App with React and Chakra UI MERN [2023]

  • Development
  • Dec 03, 2024
SynopsisBuild a Travel Blog App with React and Chakra UI MERN [2023],...
Build a Travel Blog App with React and Chakra UI MERN [2023]  No.1

Build a Travel Blog App with React and Chakra UI MERN [2023], available at $54.99, has an average rating of 4.7, with 107 lectures, based on 20 reviews, and has 117 subscribers.

You will learn about Programming in JavaScript using React JS Modern Redux with React JS Creating a travel blog web application for an audience React hooks Password hashing Redux Js Toolkit Website administration Storing images Learn building applications with Chakra UI as a component library Formik & Yup for easy form validation React Routing User Login MongoDB setup Object Data Mapping REST APIs This course is ideal for individuals who are Everybody who wants to learn modern web development, software engineering or simply wants to create their own travel blog web application to share their journeys with the rest of the world or Beginner in JavaScript, React or Programming or Looking for a modern Full Stack solution which is easy to learn It is particularly useful for Everybody who wants to learn modern web development, software engineering or simply wants to create their own travel blog web application to share their journeys with the rest of the world or Beginner in JavaScript, React or Programming or Looking for a modern Full Stack solution which is easy to learn.

Enroll now: Build a Travel Blog App with React and Chakra UI MERN [2023]

Summary

Title: Build a Travel Blog App with React and Chakra UI MERN [2023]

Price: $54.99

Average Rating: 4.7

Number of Lectures: 107

Number of Published Lectures: 107

Number of Curriculum Items: 107

Number of Published Curriculum Objects: 107

Original Price: $89.99

Quality Status: approved

Status: Live

What You Will Learn

  • Programming in JavaScript using React JS
  • Modern Redux with React JS
  • Creating a travel blog web application for an audience
  • React hooks
  • Password hashing
  • Redux Js Toolkit
  • Website administration
  • Storing images
  • Learn building applications with Chakra UI as a component library
  • Formik & Yup for easy form validation
  • React Routing
  • User Login
  • MongoDB setup
  • Object Data Mapping
  • REST APIs
  • Who Should Attend

  • Everybody who wants to learn modern web development, software engineering or simply wants to create their own travel blog web application to share their journeys with the rest of the world
  • Beginner in JavaScript, React or Programming
  • Looking for a modern Full Stack solution which is easy to learn
  • Target Audiences

  • Everybody who wants to learn modern web development, software engineering or simply wants to create their own travel blog web application to share their journeys with the rest of the world
  • Beginner in JavaScript, React or Programming
  • Looking for a modern Full Stack solution which is easy to learn
  • Hello and welcome to my course. This is a beginner’s course for building modern web applications. This is the right course for you if you are:

    – Interested in web development

    – Studying IT

    – Interested in programming in general

    – Upskilling your existing knowledge of React

    – Interested how full-stack applications are build

    – Solid understanding of programming and want to start with React/JavaScript

    – Interested in Chakra UI.

    – You are new to the world of IT and you want to start somewhere

    What will you learn?

    – React and React hooks

    – Functional components

    – State management with ReduxJs Toolkit

    – Using a component library such as Chakra UI

    – Styling and designing webpages

    – Responsive design

    – User registration and authentication (login)

    – Writing an API and storing data to a database.

    – Using MongoDB

    – Using NodeJS

    – Using Express

    – Version control using Git with Github

    – And many more…

    This course is very practical, about 90%+ of the lessons will involve you coding along with me on this project. If you are the type of person who gets the most out of learning by doing, then this course is definitely for you.

    On this course we will build an travel blog web application called TravelBay, completely from scratch using the most popular JavaScript library called React in combination with Redux, Chakra UI, NodeJs, Express, MongoDB and many more. All you will need to get started is a computer with your favourite operating system, and a passion for learning how to build an application.

    Course Curriculum

    Chapter 1: Environment Setup

    Lecture 1: Overview

    Lecture 2: Node & NPM

    Lecture 3: GIT

    Lecture 4: Visual Studio Code

    Lecture 5: Visual Studio Code Extensions

    Lecture 6: Prettier Extension Settings

    Chapter 2: Project Setup

    Lecture 1: Create React App

    Lecture 2: Starting Our App & Explanation

    Lecture 3: Removing Files We Dont Need

    Lecture 4: Setting up GIT

    Chapter 3: Chakra, Routing & Navbar Setup

    Lecture 1: Overview

    Lecture 2: How To Help Yourself

    Lecture 3: Installing Project Dependencies

    Lecture 4: Chakra Provider and Navbar Initiation

    Lecture 5: Navbar Part 1

    Lecture 6: Navbar Part 2

    Lecture 7: Navbar Part 3

    Lecture 8: Navbar Part 4 + React Routing

    Lecture 9: Navbar Part 5

    Lecture 10: Navbar Part 6

    Lecture 11: Navbar Part 7 & Our First GIT Commit

    Chapter 4: Setting Up Our Backend, Redux, & Blog Screen

    Lecture 1: Overview

    Lecture 2: Setting Up Backend Structure

    Lecture 3: Setting Up Mongo DB Database

    Lecture 4: MongoDB Compass

    Lecture 5: Blog Post Schema

    Lecture 6: Get Blog Post Route Part 1

    Lecture 7: Get Blog Post Route Part 2

    Lecture 8: Importing Data To Our Database

    Lecture 9: Redux Setup And Blog Post Slices

    Lecture 10: Blog Post Actions

    Lecture 11: Redux Store Provider

    Lecture 12: Blog Screen Part 1

    Lecture 13: Blog Screen Part 2 & Concurrently

    Lecture 14: Set Up Blog Screen Route

    Lecture 15: Blog Screen Part 3

    Lecture 16: Adding .env File To Gitignore

    Lecture 17: Debugging Blog Post Route

    Lecture 18: Pushing Our Work To The Remote Repository

    Chapter 5: Pagination

    Lecture 1: Overview

    Lecture 2: Pagination & Categories in Blog Post Route

    Lecture 3: Postman & Testing our Route

    Lecture 4: Blog Post Slice Pagination

    Lecture 5: Blog Post Actions Pagination

    Lecture 6: Pagination in Blog Screen

    Lecture 7: Redux & React Devtools

    Lecture 8: Save Your Work To The Remote Repository

    Chapter 6: Single Blog Screen

    Lecture 1: Overview

    Lecture 2: Get Blog Post Route

    Lecture 3: Blog Post Actions

    Lecture 4: Single Blog Post Screen Part 1

    Lecture 5: Debugging Blog Route

    Lecture 6: Single Blog Post Screen Part 2

    Lecture 7: Save Our Work To The Remote Repository

    Chapter 7: Contact Screen

    Lecture 1: Overview

    Lecture 2: EmailJS

    Lecture 3: EmailJS Credentials

    Lecture 4: Contact Screen Part 1

    Lecture 5: Contact Screen Part 2

    Lecture 6: Contact Screen Part 3

    Lecture 7: Contact Screen Part 4

    Lecture 8: Contact Screen Part 5

    Lecture 9: Save Our Work To The Remote Repository

    Lecture 10: Adding Name To The EmailJS Template

    Chapter 8: Login, Admin Console, & Creating A New Blog Post

    Lecture 1: Overview

    Lecture 2: User Schema

    Lecture 3: User Route

    Lecture 4: Adding User Data To The Database

    Lecture 5: Login Test In Postman

    Lecture 6: User Slice In Redux

    Lecture 7: User Actions In Redux

    Lecture 8: Login Screen Part 1

    Lecture 9: Login Screen Part 2

    Lecture 10: Login Screen Part 3

    Lecture 11: Login Screen Part 4

    Lecture 12: Login Screen Part 5

    Lecture 13: Admin Console Part 1

    Lecture 14: Admin Console Part 2

    Lecture 15: Admin Console Part 3

    Lecture 16: Admin Console Part 4

    Lecture 17: Admin Console Part 5

    Lecture 18: Admin Console Part 6

    Lecture 19: Admin Console Part 7

    Lecture 20: Admin Console Part 8

    Lecture 21: Admin Console Part 9

    Lecture 22: Admin Console Part 10

    Lecture 23: Save Your Work To The Remote Repository

    Chapter 9: Edit Blog Post

    Lecture 1: Overview

    Lecture 2: Handling Server Errors

    Lecture 3: Edit Blog Post Tab Part 1

    Lecture 4: Edit Blog Post Tab Part 2

    Instructors

  • Build a Travel Blog App with React and Chakra UI MERN [2023]  No.2
    Ben Fisher
    Software Engineer and Course Instructor
  • Rating Distribution

  • 1 stars: 1 votes
  • 2 stars: 1 votes
  • 3 stars: 1 votes
  • 4 stars: 3 votes
  • 5 stars: 14 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!