Build a Markdown Notes app with Electron, React, Typescript, Tailwind and Jotai

📚 Resources

In this video, we are going to build a Markdown Notes desktop application using Electron, React, Typescript, Tailwind, and Jotai.

Timestamps
00:00:00 Intro
00:02:16 Creating an Electron Project
00:09:38 Codebase configuration (Prettier, eslint, tsconfig)
00:19:08 Project structure
00:26:48 Styling setup
00:33:08 Creating the UI
01:11:22 Adding the Editor
01:23:30 Adding Jotai
01:49:45 File system integration
01:55:44 Reading the notes from fs
02:14:50 Reading the content of the note
02:25:00 Saving the note content
02:32:45 Implementing auto saving
02:42:19 Creating new notes
02:55:00 Deleting the notes
03:09:09 App bundling
03:13:42 Outro

[gionatha]

Unfortunately, I discovered later that Windows has some compatibility problems. Specifically, the background blur effect seems to be supported only on MacOS.

Also path separators are different: on Windows you should use `\` instead of `/`.

[mooseh]

Thank god dude. There are almost no react electron projects on YouTube. Thank you

[haiffy]

This video pops up in my recommendation, exactly when I needed this, thanks

[superuser]

Great video. Original and useful content. Well done 🎉

[SubzeroGamers]

Thanks gionatha you helped me alot, I wish you good luck for your channel!

[avocadoamongos]

Very interesting project, just what I was looking for thanks!

[anshulsoni]

really liked it, gonna make this in couple of days
thanks man

[joaonascimento]

Already subscribed to your channel! I noticed you make a effort to offer content based on the best technologies nowadays!

[andrhamm]

Great great job!! Thanks for sharing, this was super helpful!

[afkanozdemir]

This is really cool and unique project !

[azzeddinesaidi]

This is amazing, thanks for your sharing! <3

[NIXOD]

This tutorial is gold 🔥 Thank you for sharing

[dharsanr]

You are just awesome man : ) keep going 👍👍

[languageswithenoch]

This is amazing, youtube instructors hardly make full projects with electron js, Thank you so much. I am definitely working on this and adding it to my portfolio🙏🏽🙏🏽🙏🏽

[usietyn]

Thank you very much for your tutorial. You have opened my door to a new world.

[thedevnoteyt]

Finally someone with something new & unique. Please bring more Electron content if possible.

Btw have you ever tried Tauri with Solid or React ?

[kirubakaran]

Thank you so much, Extremely useful video

[lustrous]

thanks for the tutorial, it is very detailed and helpful.👍

[maurolimaok]

Nice channel.
Thanks for the inspiration

[techhck]

thanks for share this video, i love it💖