Low-Code beginner's guide to building a to-do list app with Noodl

In this tutorial (written version: tinyurl.com/3ap99vuj ), we'll look at how to build the visual parts of a to-do list app using the super simple open source low-code tool Noodl. I'll take you through your very first steps, getting to know the Noodl editor and how to create your first page and components. In the next video, how to hook up your creation to data in the Noodl back end!
Don't forget to download the step by step instructions, you know, for those of us who still read sometimes: tinyurl.com/3ap99vuj
P.S. Want me to build your project for you? I've like totally got an agency and whatever! digitalbricks.io
Contents
00:00 Introduction
02:10 1. Create a new project
03:50 2. Create the header
08:55 3. Change the header's parameters
15:53 4. Style the text nodes
19:35 5. Make it sticky
20:00 6. Create a component and use it
27:22 7. Build a task item
28:46 8. Adding a checkbox and a button
30:29 9. Style the checkbox
31:47 10. Style the delete button
33:32 11. Style the button's hover state
34:23 12. Creating a list item component
36:28 13. Add scrolling to the task item list
36:50 14. Create an add task component
39:26 15. Style the text input node
42:00 Outro

[@marcola_la]

Very good lesson. Thanks!

[@simple-rick-tutorials]

Glad you liked it!

[@krisanderson5636]

I previously left a rather frustrated comment under this video, which I have now deleted. I think I was getting overwhelmed because I was trying to learn this too quickly. Now that I've calmed down, I can see that your video tutorials are really excellent and explain a lot of things that I was getting frustrated about, so I just wanted to say thank you for posting this. I have now subscribed.

[@simple-rick-tutorials]

No problem Kris, you’re very welcome! I’m glad my videos helped and I hope you find more success on your Noodl journey :)

[@emddebatebriankim9942]

The top link for the written version included ")" at the end (returning 404 Not Found). Great video!

[@simple-rick-tutorials]

Thanks a lot for the bug Brian! Should be fixed now :)

[@RezaulKarimArif]

Thank you. I was looking for Noodl guide. Couldn't find anyone.

[@simple-rick-tutorials]

Glad it helped! Keep an eye out for more ;)

[@RezaulKarimArif]

@@simple-rick-tutorials absolutely. Is there any directory to see apps built with Noodl? Couldn't find any thanks

[@simple-rick-tutorials]

Unfortunately not yet! I’m sure there’ll be more soon. In the meantime you can check out my app dev.learnbook.app

[@denniszenanywhere]

@@simple-rick-tutorials Looking forward to more tutorials from you.

[@jacksonsmith...]

​@simple-rick-tutorials hello i love the tutorial. Can i use Noodl as Frontend and a Python framework as a backend. Example Django or Fastapi.
Thank you for your time.

[@brandonstinebrickner6974]

Cool. Looking forward to learning more about Noodl and making some cool stuff with it!.

[@simple-rick-tutorials]

Hey Brandon! Happy to help and I wish you luck on your Noodl learning journey. Don't hesitate to join the Discord for more assistance :)

[@Uncool-vn5vz]

Please tell me that Noodl will continue to exist? I am a total beginner. Thanks!
I saw something called Flux that is a fork, but that's paid. Does this mean that Noodl will stop to exist? Thanks in advance.

[@simple-rick-tutorials]

You can bet your sweet behind Noodl will continue to exist! FluxScape and Code Crusher are the two main community forks keeping the Noodl dream alive. Check out this video for all the info you need
ua-cam.com/video/OYnVXGIJWTg/v-deo.html