Course image for React Contacts App

React Contacts App

Learn how to create an end-to-end app with React using Firebase and deploy it to Netlify in this short course

6 hours+ of total content
0.0
0 ratings
80 developers learning
Course Creator: Mehul Mohan

Hang on...

Goals

  • React Fundamentals
  • Using Firebase + React
  • Deploying to Netlify
  • File uploading and processing
  • Complete application tutorial
  • Semantic UI for the UI Components

Description

React is a very popular technology, and you can now learn to code in React by building a real world application and deploying it online on Netlify.

This course would cover the core of how to build things with React, with Firebase being used as a backend tool to handle file uploads and enhancements. We'll be covering a lot of stuff in this project, including:

  1. Introduction to React
  2. Functional Components
  3. Routing
  4. APIs
  5. Deployment
  6. Optimization and code enhancements
  7. Semantic UI
  8. And more!

Let's start!

Course Structure

31 lectures • 06:25:09 total duration

All Videos

(31 lectures • 06 hours and 25 minutes)
  Introduction (Watch video)
08:31
  Folder structure (Watch video)
07:49
  Application Routes (Watch video)
13:05
  Axios Tutorial + Environment Variables (Watch video)
10:59
  Semantic UI + React (Watch video)
13:22
  Context API Setup (Watch video)
11:33
  Semantic UI Form Registration (Watch video)
21:13
  React Authentication (Watch video)
28:18
  React Authentication Part 2 (Watch video)
15:38
  Route Protection with React (Watch video)
06:57
  Axios Auth Interceptor (Watch video)
10:52
  React Router Document Titles (Watch video)
03:22
  React Context API Tutorials (Watch video)
21:47
  React Authentication - Logout (Watch video)
08:37
  Semantic UI + React (Watch video)
16:30
  Making a POST Request (Watch video)
23:50
  React Router Prompt (Watch video)
08:23
  Custom Confirm Prompt Example (Watch video)
14:19
  Store images on firebase (Watch video)
27:55
  API Optimization (Watch video)
06:48
  Create Image Thumbnails (Watch video)
10:38
  Create Carousels (Watch video)
21:46
  Custom Carousel (Watch video)
04:02
  Search Filter - Global Search (Watch video)
13:18
  Search Filter - Enhancements (Watch video)
03:41
  Deleting Items (Watch video)
13:39
  Editing Items (Watch video)
16:35
  Lazy loading (Watch video)
04:29
  Deploying to Netlify (Watch video)
09:17
  Untitled video 
00:00
  Test video 
07:56

Course Reviews

No reviews yet

Your Course Instructor

Course Instructor Image

Mehul Mohan

Full-stack developer and security researcher

I'm a full-stack developer working with JavaScript and its associated runtimes for the past 7 years. I love to play with code and make something useful out of it! You can find me on social media, I'm quite active there :)
codedamn logo

We ♥ quality. And we would love to see your growth. Hence, codedamn comes with a pro plan for advanced and accelerated learning!

Free

  • HD video content
  • Certificate of completion
  • Mentorship from codedamn staff
  • Support over WhatsApp
  • Full learning path unlocked
  • Unlimited hands-on practice

Pro

  • HD video content
  • Certificate of completion
  • Mentorship from codedamn staff
  • Support over WhatsApp
  • Full learning path unlocked
  • Unlimited hands-on practice
Try codedamn Pro (7 day free refund)