Great video. I broke the Task file in some extra components and learned a lot on how to pass values between components. Thanks a lot! 😄
completed the tutorial in 3 days and learned so much from this. it turned out an amazing experience watching the app work in my browser although that emoji part I didn't understand. Thank you 😊
Glad to hear that you enjoyed this project! 🙂
What was it about emojis that you couldnt understand? The purpose of it? Or how to put them?
Thanks for the fun project! You asked at the end, "what other projects would you like to see?" ... How about a React todo list with drag and drop functionality? This way you could order your tasks and prioritize them. Maybe have an option to turn numbering on and off as well. Thumbs up and thanks again
Great tutorial man thank you very much! If you could do a css-react tips and tricks would be dope
This was fun to build along with you. i will be adding a timer to mine
Like a pomodor timer or timer to countdown time for each task? Sounds like a nice idea.
Drop a link when it’s done!
thank you, I love the this tutorial
I love this tutorial, please make more quality React Beginner Tutorial like this. Also, what's the extension that you use that showing things like (initialState:, effect:, value: ) when you are writing the hooks?
Your video is very good. In fact I am not seeing as many likes it deserved. Bravo! Not having to use nanoid() or uuid() makes it better. I suggest you first write down the steps before starting to record. This eliminates having to go back and forth - it disconnects inexperienced ones.
wow sir thank you
Send you thanks and love many Egypt ❤❤
Can you make a video on your developer environment, what all tools you use?
👏👏👏
Getting one bug
removing all todos->refresh again 0th index todo is rendering(0th index value is not getting removed from local storage).
I am getting error using the below code
export default function Checkbox({defaultChecked :boolean = false}) {
const [checked , setChecked ] = useState(defaultChecked);
At 6:20 when I am writing the code const [value, setValue] = useState(initialState: ''); in VS Code, It is showing error : Parsing error: The type cast expression is expected to be wrapped with parenthesis
the "initialState:" -thing is not part of the code. It's just a hint from my editor.
the code is only:
const [value, setValue] = useState('');
@32:24 how did you get that all files search option? It's only in Intellij and not in vs code. Really curious about it.
i cannot get my app to show the ticks, but on the console, it toggles "true" or "false" (works correctly). on the App the task doesnt show those ticks when selected. i have tried debugging, nothing seems to be the problem. secondly, removing checked/setchecked state is throwing up error.
the app has a bug. When you delete the last task and try to refresh, the last task will always remains. Is it related to the useEffect?
here's the working code:
import './App.css';
import Task from './Task';
import TaskForm from './TaskForm';
import { useEffect, useState } from "react";
function App() {
const [tasks, setTasks] = useState(() => {
const storedTasks = JSON.parse(localStorage.getItem('tasks'));
return storedTasks !== null ? storedTasks : [];
});
useEffect(() => {
localStorage.setItem('tasks', JSON.stringify(tasks));
}, [tasks]);
// or //
import './App.css';
import Task from './Task';
import TaskForm from './TaskForm';
import { useEffect, useState } from "react";
function App() {
const [tasks, setTasks] = useState(() => {
const storedTasks = JSON.parse(localStorage.getItem('tasks'));
return storedTasks ?? [] ;
});
useEffect(() => {
localStorage.setItem('tasks', JSON.stringify(tasks));
}, [tasks]);
@@egyptianatmosphere-ahmedbe4211 impossible. It works for me it mean you didn’t wrote correctly, i sent 2 version of solution just copy 1 of them…
@@egyptianatmosphere-ahmedbe4211 you need to use the “useState” inside while you are declaring [task,setTasks] = useState((…
Just move the 2nd useEffect to top and remove the empty tasks check from the 2nd useEffect. I haven't completed this yet, but, I was also wondering about the same thing and tried it just now.
I dont understand what is useState(initialState: '')
Everything is fine but the voice is not clear plz check it once. Thankyou for this mini project
Please next time show the filenames while you're working.
Followed your video and coded myself. Learned a lot. Thank you so much! More react videos please!