React Router Hooks and Links - React JS Beginner Project

Overview

Learn how to implement React Router hooks and links in a beginner-level project. Explore essential concepts including applying CSS, creating components like Header and Nav, utilizing React Router Links, managing state for search and posts, and implementing various components such as Home, Feed, and Post. Dive into advanced topics like using the useParams and useHistory hooks, creating a NewPost component, handling form submissions with date-fns package, and implementing search functionality with useEffect. Also, cover error handling, creating a 404 page, and building Footer and About components. Perfect for developers looking to enhance their React and React Router skills through hands-on practice.

Syllabus

Intro
Welcome
Quick Objectives
Applying CSS to the project
Header component
Nav component and React Router Links
Adding search state
Adding post state and starter post data
Adding search results state
Passing props to Nav component
Home component
Feed component
Post component
PostPage component and useParams hook
handleDelete function and useHistory hook
NewPost component
handleSubmit function and date-fns package
Adding search functionality with useEffect and filter
Correcting a handleSubmit function error
Missing component / 404 page
Footer component
About component