React JS Crash Course (2019)
Why Stack Overflow recommends it
Stack Overflow users link it as a beginner-friendly React starting point, and many askers cite it as the tutorial they were following when they hit setup or version-mismatch errors.
Recommended by 5 people across 4 different months, 2019 to 2020.
What it is
A 2019 crash course from Traversy Media's Brad Traversy that teaches React fundamentals (components, state, props, JSX, events) by building a todo app with create-react-app and class components. It runs about an hour and a half and has no backend.
What people said
Recommends Faisal · 2019-01 · Stack Overflow · on “What is the difference between react framework & Backed framewaork”
Okay so firstly, ReactJS & React-Native are for two different areas, ReactJS is primarily for web applications like websites. React-Native is mostly mobile development for as a Native hybrid solution to create applications for iOS, Android & Windows. I would recommend picking one and learning it thoroughly, if you want a website go for ReactJS , if you want mobile apps then go for React-Native . When you're searching for help, try not to confuse the two, here's a few guides. React-Native Guides: [LINK] [LINK] [LINK] ReactJS Guides: [this video] [LINK] [LINK]
Recommends beyond_inifinity · 2019-04 · Stack Overflow · on “reactjs component for uploading csv file to server is not working properly”
@ChrisG I followed this tutorial reactjs on youtube [this video] . Can you give me a possible idea about how to upload local csv file to the server? Thank you
Recommends Usman Khalil · 2019-09 · Stack Overflow · on “Can I create entire CRUD operation using REACT JS without node JS?”
This tutorial might help you: ReactJS Tutorial [this video] Here Brad created a complete todo app without any backend. Furthermore, if you want to store data, you can use local storage.
Recommends stu · 2019-09 · Stack Overflow · on “I have trouble running this code on my project react.js”
What I would do is follow this: [LINK] this will give you a guide on how to start a react App Are you receiving any errors when running the code? it could be a number of reasons why it is not working Make sure you have import React from 'react'; import ReactDOM from 'react-dom'; At the top of the file you are editing Also maybe go through a few youtube tutorials on React so it gives you a basic understanding on structure set up, creating new components, passing props, state etc.. I always find Traversy Media explains topics quite well: [this video]
Recommends point5 · 2020-10 · Stack Overflow · on “Add style.css for a specific component in react”
You can refer to this link on which the narrator is explaining the options you have for styling the React Components. Styling in React [this video] Your options are In-Line styling Using variables styling by means of a function or method inside the component Once you take a look at the video link, you will know what approach suits you the best.
Cites Ryuujo · 2019-01 · Stack Overflow · on “Parsing error: Unexpected token ReactJS Problem”
I was new in ReactJS and I want to learn the basics from Traversy Media's video tutorial and I apply the code exactly what he have to do. But I got stuck in this part [this video] because I got an error Failed to Compile like this: [LINK] This is the code I have written: App.js import React, { Component } from 'react'; import Todos from './components/Todos'; import './App.css'; class App extends Component { state = { todos: [ { id: 1, title: 'Take out he trash', completed: false }, { id: 2, title: 'Have a Dinner', completed: false }, { id: 3, title: 'Meeting with Boss', completed: false }, ] }; render() { return ( <div className="App"> <Todos todos={this.state.todos} /> </div> ); } } export defau
Cites Justin · 2019-06 · Stack Overflow · on “function App() vs class App extends Component in the App.js file”
I'm following a tutorial on React ( [this video] - dated January 3, 2019) and created a React app with npx create-react-app *app_name* . The App.js file this command generated on my computer is different from what this command generated for the person giving the tutorial. Has React changed since then or is it possible I downloaded something wrong? My App.js : import React from 'react'; import logo from './logo.svg'; import './App.css'; function App() { return ( <div className="App"> <header className="App-header"> <img src={logo} className="App-logo" alt="logo" /> <p> Edit <code>src/App.js</code> and save to reload. </p> <a className="App-link" href=" [LINK] " target="_blank" rel="noopener norefe
Cites Paul McDowell · 2019-08 · Stack Overflow · on “TodoItems do not appear in UI using React and Firebase”
I'm following Traversey Media's React crash course, [this video] and I wanted to extend what he built to save TodoItems to a Firebase realtime database. The TodoItems save just fine, but do not appear in the UI. I've tried having the app start with a hard-coded TodoItem in case it was an issue of having an empty array, but this does not help anything. relevant methods: (full code available at [LINK] ) // Delete todo item delTodo = (id) => { fire.database().ref(`todos/${id}`).remove() .then(function(){ this.setState({ // Loop through todos array and filter out item with provided ID // ... is the spread operator, used here to copy the todos array todos: [...this.state.todos.filter((todo) => todo.id
Cites Dennis Castoral · 2019-08 · Stack Overflow · on “boilerplate starter file different”
I am using create-react-app and after creation in App.js I should see class App extends Component similar to: class App extends Component { render() { return( ; I am seeing this as Default: function App() { return ( <div className="App"> <header className="App-header"> <img src={logo} className="App-logo" alt="logo" /> <p> Edit <code>src/App.js</code> and save to reload. </p> <a className="App-link" href=" [LINK] " target="_blank" rel="noopener noreferrer" > Learn React </a> </header> </div> ); } export default App; I am following a tutorial and it clearly shows this here [this video] I am using a newer version of node v10.15.3 and also npm 6.4.1 though I am not sure why the syntax would not foll
Cites skellyton3 · 2019-12 · Stack Overflow · on “Default React Component not rendering (Create-React-App)”
UPDATE: This problem has been solved by simply using a different browser. I was originally using Microsoft Edge as that is what NPM Start automatically opened. For some reason it appears to work perfectly when manually pasting localhost:3000/ into Chrome. I am brand new to React and I am trying to set up a basic test project. I have been following some tutorials, this one in particular [this video] My issue is that for some reason when I try to test the basic boilerplate I don't see anything from the basic component. From what I understand there should just be a basic logo, but my page is completely blank. I don't know what code is relevant to post since I am very new so if you think something mi