Todo List

Creating a basic Todo list with Remix

You can visit the deployed site here Todo List
You can view the source code here Github
Honestly, I overlooked the significance of creating a basic todo list when I first delved into coding. I considered it a trivial task and didn’t comprehend its value until I started learning to code. A basic app like a todo list serves as a fundamental training ground for web development, encompassing the CRUD functionalities: Create, Read, Update, and Delete. By utilizing the Remix-run meta framework and formData instead of more intricate options like state and React, I reinforced my knowledge of web development basics.
For this particular todo app, my primary focus was to strengthen my skills in a few areas:
1. Layout: I needed to refine my CSS skills, and Tailwindcss proved to be an excellent tool to achieve this goal.
2. Outlets: With Remix’s outlets, I could seamlessly render child routes. I employed an outlet in this app to display the “/new” route on top of the todos list, thus eliminating any navigation required to create a new todo.
3. UseFetcher My aim was to practice using fetcher to edit or delete todos without having to navigate to a separate page.

Overall, I am pleased with how this app turned out. Although I still face challenges with CSS, the app functions seamlessly. I am looking forward to creating more apps with Remix-run and improving my skills in web development.