Build your first React Project
Build your first react project with React and Tailwind
React,Front End Web Development
Lectures -13
Duration -1.5 hours
Get your team access to 10000+ top Tutorials Point courses anytime, anywhere.
Course Description
React JS, built by Facebook is the most popular JavaScript framework. Take a project based approach to learning, by creating your first React Application.
In this course we'll build a mobile first web application that covers topics such as:
Creating a React single page app with npx create-react-app
JavaScript configurable CSS
Animated components
React Router
HTTP requests with Axios
Creating your own custom hooks for React
Goals
The goal of this course is to learn basic React JS skills.
- You will learn how to create a new React App with Create React App (CRA).
- You will also add a CSS framework, build basic components and advanced components like a mobile menu.
- You will interact with a JSON Api to fetch data from an external source.
Prerequisites
This course will assume you already have the following:
- Previous experience with HTML & CSS
- Previous experience with JavaScript
- Basic understanding of how to use he command line
- An understanding of NPM or Yarn
![Build your first React Project Build your first React Project](https://d3mxt5v3yxgcsr.cloudfront.net/courses/16827/course_16827_image.jpg)
Curriculum
Check out the detailed breakdown of what’s inside the course
Introduction to React
1 Lectures
-
Introduction Video 07:40 07:40
Introduction to Create React App
1 Lectures
![Tutorialspoint](/market/public/assets/images/loader.gif)
Create your first component
2 Lectures
![Tutorialspoint](/market/public/assets/images/loader.gif)
Create a Mobile Navigation with React and Tailwind
3 Lectures
![Tutorialspoint](/market/public/assets/images/loader.gif)
Use React Router to create a multi-page site
1 Lectures
![Tutorialspoint](/market/public/assets/images/loader.gif)
Fetch data from a JSON API
3 Lectures
![Tutorialspoint](/market/public/assets/images/loader.gif)
Create custom hooks
1 Lectures
![Tutorialspoint](/market/public/assets/images/loader.gif)
Final Video
1 Lectures
![Tutorialspoint](/market/public/assets/images/loader.gif)
Instructor Details
![Quentin Watt](https://www.tutorialspoint.com/assets/profiles/728511/profile/200_1185127-1696871098.jpg)
Quentin Watt
A full stack developer, with more than a decade of experience creating web applications. Drawing inspiration from all those years of experience, I love creating video content sharing solutions that have worked for me.
Today, I primarily build Laravel based projects, with some JavaScript SPAs using either Vue.js or React.
I've also been teaching code on YouTube since 2011, my content has helped thousands of students with their studies, and new web developers start their careers.
Course Certificate
Use your certificate to make a career change or to advance in your current career.
![sample Tutorialspoint certificate](/market/public/assets/newDesign/img/primePacks/V-certificate.png)
Our students work
with the Best
![adobe logo](/market/public/assets/newDesign/img/adobe.png)
![adp logo](/market/public/assets/newDesign/img/adp.png)
![apple logo](/market/public/assets/newDesign/img/apple.png)
![armani logo](/market/public/assets/newDesign/img/armani.jpg)
![bosch logo](/market/public/assets/newDesign/img/bosch.png)
![capegemini logo](/market/public/assets/newDesign/img/capegemini.png)
![cisco logo](/market/public/assets/newDesign/img/cisco.png)
![hdfc bank logo](/market/public/assets/newDesign/img/hdfcbank.png)
![ibm logo](/market/public/assets/newDesign/img/ibm.png)
![intel logo](/market/public/assets/newDesign/img/intel.png)
![mastercard logo](/market/public/assets/newDesign/img/mastercard.png)
![netflix logo](/market/public/assets/newDesign/img/netflix.png)
![qualcomm logo](/market/public/assets/newDesign/img/qualcomm.png)
![samsung logo](/market/public/assets/newDesign/img/samsung.png)
![sony logo](/market/public/assets/newDesign/img/sony.png)
![unilever logo](/market/public/assets/newDesign/img/unilever.png)
![walmart logo](/market/public/assets/newDesign/img/walmart.png)
![adobe logo](/market/public/assets/newDesign/img/adobe.png)
![adp logo](/market/public/assets/newDesign/img/adp.png)
![apple logo](/market/public/assets/newDesign/img/apple.png)
![armani logo](/market/public/assets/newDesign/img/armani.jpg)
![bosch logo](/market/public/assets/newDesign/img/bosch.png)
![capegemini logo](/market/public/assets/newDesign/img/capegemini.png)
![cisco logo](/market/public/assets/newDesign/img/cisco.png)
![hdfcbank logo](/market/public/assets/newDesign/img/hdfcbank.png)
![ibm logo](/market/public/assets/newDesign/img/ibm.png)
![intel logo](/market/public/assets/newDesign/img/intel.png)
![mastercard logo](/market/public/assets/newDesign/img/mastercard.png)
![netflix logo](/market/public/assets/newDesign/img/netflix.png)
![qualcomm logo](/market/public/assets/newDesign/img/qualcomm.png)
![samsung logo](/market/public/assets/newDesign/img/samsung.png)
![sony logo](/market/public/assets/newDesign/img/sony.png)
![unilever logo](/market/public/assets/newDesign/img/unilever.png)
![walmart logo](/market/public/assets/newDesign/img/walmart.png)
Related Video Courses
View MoreAnnual Membership
Become a valued member of Tutorials Point and enjoy unlimited access to our vast library of top-rated Video Courses
Subscribe now![Annual Membership Annual Membership](/market/public/assets/newDesign/img/membership-large-small.jpg)
Online Certifications
Master prominent technologies at full length and become a valued certified professional.
Explore Now![Online Certifications Online Certifications](/market/public/assets/newDesign/img/traning-for-a-team.png)