React - How To Build CodePen With React

Discover React Mastery: From Essential Concepts to Advanced Hooks, Master React Development with Real-World Projects and Boost Your Skills in Record Time!

4.0 (0)

12 learners

What you'll learn

Understand the fundamental concepts of React, including components and hooks.
Differentiate between React state and props and their respective uses.
Build and enhance web applications using React, including implementing features like infinite scrolling and currency conversion.
Apply React best practices to optimize application performance and debugging processes.

This course includes

43.3 hours of video
Certificate of completion
Access on mobile and TV

Summary

Keywords

webdevsimplified codepen clone codepen codepen react codepen react clone react js reactjs react js project reactjs project react tutorial react js tutorial reactjs tutorial

Full Transcript

🚨 IMPORTANT: Learn React Today Course: https://courses.webdevsimplified.com/learn-react-today I love CodePen. It is perfect for prototyping project ideas and is a really cool idea. I like it so much I decided to see what it would take to create my own CodePen. In this video I will be showing you how to create a simple clone of the core functionality of CodePen using React. 📚 Materials/References: GitHub Code: https://github.com/WebDevSimplified/React-CodePen-Clone 🧠 Concepts Covered: - How to create a text editor in React - How to render custom HTML/CSS/JavaScript 🌎 Find Me Here: My Blog: https://blog.webdevsimplified.com My Courses: https://courses.webdevsimplified.com Patreon: https://www.patreon.com/WebDevSimplified Twitter: https://twitter.com/DevSimplified Discord: https://discord.gg/7StTjnR GitHub: https://github.com/WebDevSimplified CodePen: https://codepen.io/WebDevSimplified ⏱️ Timestamps: 00:00 - Introduction 00:32 - Demo 01:06 - Code Setup 02:59 - HTML Setup 05:34 - Editor Setup 12:35 - CSS 17:13 - CodePen Functionality 21:10 - Open Close Button 26:22 - Local Storage Hook 30:14 - Outro #CodePen #WDS #ReactJS

Continue this lesson in the app

Install CourseHive on Android or iOS to keep learning while you move.

Welcome