How to build a Markdown editor using Electron, ReactJS, Vite, CodeMirror, and Remark

[@devaslife]

I also built a Markdown note-taking app: Inkdrop www.inkdrop.app/?Bis8EgoAg

[@khalilbugti4079]

My dream to visit japan at least once in my life because you people are really honest and amazing.

[@usakadam]

Vim, mechanical keyboard, no commentary, beatiful aesthetics are so relaxing and top-notch. I love this channel. It motivates me a lot.

[@viperactual]

allows one to focus.

[@ITZollx]

The effort you put into your content is always apparent and it shows in the end product, by far one of my favourite content creators!

[@devaslife]

Thanks, Swanny!

[@apidas]

this guy programming swag level is through the roof and he's a frontend engineer

[@blessdarah1256]

The keyboard sound is so refreshing

[@Kevinppaulo]

Man, the aesthetics of your videos are just SPOT ON.

[@nikolajjsj]

One of the few KZbinrs I've truly enjoyed every video from, in the last couple of years! Great work and keep it up!

[@devaslife]

Thank you, Nikolaj!

[@bienjieonex]

It's raining here...and this is perfect!! Best ASMR ever!!...

[@atrocitykings684]

Wow. This is probably one of the best coding video i have ever watched. Great job mate! I started to look for a download link but you provided a git with full tutorial! Thats insane! SUBBED!

[@neunmalelf]

Your Video-Editor Skills are skyrocketing! 👍👏

[@devaslife]

Thanks!

[@joseanchietadev]

Thank you for sharing this video, it's amazing how calm and concentrated I'm during your videos.

[@InuDeveloper]

You saved my life, this video helped me find a template to start coding my new project

[@solomonlijo]

Hey, I am just 13 and I was looking for an in-depth tutorial. I didn’t find a an in-depth tutorial but a legendary tutorial

[@constWardtz]

I love the minimalism of your videos

[@A--_--M]

Wasnt here for the ASMR but that was very welcoming. Clean, minimal & beautiful content.

[@0onima]

your style is so aesthetic, I'm hoping to have something similar to this someday

[@tobiasfalk7345]

Oh my... that's so super satisfying. Better than any ASMR.

[@madvillany420]

I’m amazed on how many fonts you remember off the top of your head.

[@jrupp2823]

lowkey the best video on KZbin lol so glad this blew up

[@sainathsingineedi2922]

Need more of these 🔥

[@SuboptimalEng]

👀

[@sainathsingineedi2922]

@@SuboptimalEng haha

[@swastikacharyya]

As a long time subscriber of yours I knew that this video is gonna be great ❤️❤️ but as a asmr lover and programmer I didn't know that you are gonna make it greater and more awesome 🌝❤️ Thank You for this kind of videos and this is so sick ❤️🔥

[@devaslife]

Thank you, Swastik! So glad you enjoy it🤩

[@tsioryfitiavanaanhykrishna6992]

Love your contents ! I love the way you make videos. And that keyboard sound OMG keep up the good works Takuya ! Love from Madagascar !

[@a-z2928]

Dang, that's a god given talent. Enjoyed watching your tutorial.

[@taqyathallahxtkj1962]

Mechanical keyboard+No Commentary im enjoying play your video.... Thanks Sir...

[@HazemTamimi]

Another level. Just a whole other level! Thank you!

[@chyldstudios]

You have mixed ASMR with Coding videos ... Brilliant!!!

[@devglow-amindu]

The sound of the mechanical keyboard is always a welcome sound.

[@codentime7881]

the only programmer that tell everything without speak any word

[@mcodes5214]

Man you're videos quality is so awesome.

[@mayankdutta2832]

Your creativity is always next level

[@devaslife]

Happy to hear that :)

[@BilalBudhani]

amazing & insightful video! I always love your content and look forward to learning from you. Much love from India 🇮🇳!

[@anupamkumarkhamrai8924]

Recently started watching you but i like your content very much ..end product looks polished

[@ITSH4WK]

This is hands down my new favorite channel. Amazing 👍

[@thanatosor]

This channel is more useful for dev community than something like techlead

[@diwakar8815]

Subscribers : How much asmr are you going to add to these videos Devaslife: Yes 😆

[@devaslife]

Hahahah😆

[@willl0014]

This is an amazing display of skill

[@someoneyouveneverheardof]

These videos are gold 💛

[@fleischer444]

I love it, this makes me regret not getting in to C++ in high school in the 90s like everyone told me to. 😂

[@JuankM1050]

No idea what are you doing but beautiful video man.

[@Alba-zr9jq]

I like your design (visualization and keyboard sound).

[@auntiecarol]

I usually watch youtube at 1.5x speed, and came across this video quite by accident, thinking I might slow it down a bit to see what was being typed here and how the pieces go together. Somehow settings had reverted to 1.25x speed. Intrigued I went to normal... DAMN! Still fast.

[@hashanchandika7110]

so cool, might wanna try this...btw what is the tool you use to show keystrokes you press? so handy 👌😍

[@devaslife]

KeyCastr

[@lineupp9199]

I think you just invented a new genre: coding ASMR

[@devaslife]

"Coding ASMR" - Nice naming!

[@mprasanth18]

How are you remembering all the package names and all the functions available in it? Its just mind blowing.

[@bnny2175]

Thank you very much for this. Can we also get a React Native how to like this one.

[@sonhohuynh8720]

at 6:54 has a (button)jaim. What does that button mean?. I can't find sign on keyboard. please, Is it used to move between lines ?. Thanks you

[@firexwow]

Dumb question: how do you make the IDE returns the error on the line you're coding, like at 6:43? That seems to save so much time

[@ianmusyoka9717]

Your terminal looks amazing can you outline the steps you used to customize it i do the same on mine. Love your project too 💪

[@RuslanKovtun]

He has public dotfiles repo, you can check it out

[@FinoTheSuper]

Hi Takuya, i'm a solo SaaS developer, i love your content about your programming and develop you app. Would love to see how do you manage your marketing part if there is any.

[@teknologene]

ASMR ASMR ASMR ASMR. I fell asleep while watching but woke up just before the end. HAHA

[@devaslife]

😆

[@icarusgk9856]

Gonna add this to my portfolio

[@meerzulee]

I wish I was coding like you 😯

[@aminehero4729]

you are an artiste , bravo

[@tannerbyers6729]

I love your content! I listen to it while I work and will watch while my code compiles XD. I wish it was a little more realistic with like using packages and stuff... unless you actually remember every component inside all the dependencies you use :') If so, I'd hate to call myself a programmer lol

[@surjeet7311]

Hi Taukya I got lots of error when I write code-mirror configurations on use-codemirror file and then setup codemirror editor in editor.jsx and after that when I call my component in App.js please make a video again on how to build markdown editor and also I tried to fork your markdown-editor- repo and installed its dependency but it doesn't run in local.

[@logannorman1155]

same issue

[@gauravsood378]

how to configure vim to detect the errors just as at time stamp 6:36 ?

[@jomoc6112]

i dont understand everything aside from electron (because i code in vscode) but i watch your video until it end its so unique and inspiring. please do a video why you choose vim over vscode please i want to understand your point of view. because at the moment i want to use vim like you to look cool.

[@NERO-ez1mn]

it will be soothing if we can hear your voice even all of us will go "WAKARANAI!!!!!!" it will look "SUGOI" && that HHKB is smooth

[@渔圈孙]

wow,i really fancy the appearance of your vim. Can you make a video to tell me how to config it?😍😍😍

[@ThiagoBussola]

Transparent background doesn't work on Manjaro Linux, white background instead, I'm trying to get answers, but also bug in electron github, can you help me with that?

[@rhquintero]

Same on Windows, seems only works on Mac

[@codefactory_official]

Ooh i really wanna know how u are editing the vids. What effect is the hologram vim thingy? Also what are you using to record the screen? Greatly appreciated

[@thecodingyoungster]

At 20:14 i have an error. I have followed you exactly and this is the error i get: Uncaught Error: Unrecognized extension value in extension set ([object Object]). This sometimes happens because multiple instances of @codemirror/state are loaded, breaking instanceof checks. Can anyone help ne please!!!

[@devyan7790]

hello! I'm having the same error, I wanted to know if you were able to solve it :/

[@henryb.aguilar2438]

Dude, you're awesome!

[@snipzmattio5887]

Nice video! Just started writting in mardown myselft

[@abdullohtursunov3380]

Your typing is amazing,

[@a062693069]

OMG!!! Very high quality

[@chandragie]

This is gold!!! 🔥🔥🔥

[@lemp99]

what is 'open' in 39:32 ? It's some package ? love your videos ❤️

[@devaslife]

It's a macOS's built-in command

[@pandusuryatantra]

Hi, Takuya. I wonder how you put keystroke display on your video. Would you show me how? Very nice video!

[@aqua1144]

Amazing! BTW which terminal are you using? Can you please share the customizations?

[@reemmikulsky1382]

I would like to know too

[@NexushasTaken]

He just use the default terminal by os he is using and customize it with dotfiles

[@_mannyponce]

great vid. is the kb using MX Reds?

[@devtopia_]

What type of switches are you using? It’s pleasing 😌

[@darkhorse99900]

Why do you prefer to manually type out the closing JSX? Wouldn’t it be easier to have auto closing JSX once you open a JSX

[@MarjoForcado]

It feels like I'm watching a cooking show, but for programming.

[@devaslife]

Exactly

[@yinitialize4930]

which type of switches does that keyboard has? it sounds very nice and deep

[@jamiebradley5520]

Great video! Please could you share what keyboard switches are you using?

[@devaslife]

Please watch the previous video

[@Jeffrey7P]

How did you get the curvy ends on powerline10k? Also what kind of keyboard build are you using?

[@ovct8117]

thanks for the asmr haha, i appreciate your job!

[@swastikacharyya]

I have three questions ( cause I got some errors while building this 😀 ): 1: How to change the fonts mentioned in 9:30 around for Linux, as you are using Mac OS " --apple-*** and also BlinkSystem*** " fonts. And also in quotes we have to write only till sans not the full name like "Firs Sans Mono" ? 2. What is " --moz-osx smoothing" is it specific to Mac, if then what is for Linux? 3. How You Make such great videos ?🌝❤️🔥

[@swastikacharyya]

Help Anyone Please ??

[@harshkc99]

@@swastikacharyya Did you find something?

[@swastikacharyya]

@@harshkc99 Yeah , the first 2 problems or the actual problem is just specific to Mac OS because those are targeted and specific to Mac only , can't change it. So you have to either tweak the font it self and moz-osx font smoothing is to , so use webkit-font-smoothing. Google the specific keywords for more help , you will find souch documentations. ;)

[@kenshinhu2823]

What does the 'vim' unit mean in 'calc(10px + 2vim)'?

[@zaron8614]

What browser are you using? Pls

[@andrejaccon]

why i dont like the type sounds ?

[@nkr4318]

Thanks a lot for very beautiful video

[@SuboptimalEng]

Great video! I'm wondering why you didn't use the default React + TypeScript config for Vite 👀

[@devaslife]

Because it's an Electron app

[@insanity0312]

@@devaslife Because you started with a template from github and it came with the vue setup right?

[@jspnser]

Love your channel, can you please make some tutorial on react? Your videos has helped me a-lot recently getting back my motivation for web development. Thank you!

[@SalmanKhanCodingboy]

Keyboard are so refreshing, is your keyboard keychron v2 with red?

[@4Dudu]

Have you noticed that when writing .tsx files the closing bracket always get wrong indentation until you save and format? Where do you think this "problem" comes from? When you open brackets in other type of files the closing bracket is always in correct position.

[@pritam-kunduu]

The transparency is not working on windows. instead only white background showing. I searched all google but could'nt find a fix. Please let me know if anyone finds a fix. It is a really nice app and I dont want to waste it without the transparency effects

[@JDR_ZA]

Is this the first time coding this application? Or are you redoing it for the tutorial? I mean, you have to prepare the tutorial first, right?

[@amanali9501]

Amazing content Just a silly questions why are not using text editor like vscode , sublime or any

[@weiyuluo637]

Have you changed your keymaping? I didn't see you click the ESC key.

[@JakubSK]

Thank goodness someone else uses Vim and not something crappy like Visual Studio or VS Code.

[@vanduysfs]

Love your vid so much! hope you will make a vid for sharing about how you can code so fast :D speed of light

[@ingridtrujillo209]

Hey, Hope that you're fine, I've got one question, it's posible to do with Electron something like a driver updater?

[@saidafzalkholkhujaev]

How do you show which key is pressed? Is it an OBS plugin?

[@atrocitykings684]

devaslife any fix for "error while loading shared libraries: libxshmfence.so.1: cannot open shared object file: No such file or directory" when i run npm run watch?

[@jexxiewoo8390]

Nice! Btw, what app is it for your mouse click capture？

[@devaslife]

Cursor Pro: apps.apple.com/us/app/cursor-pro/id1447043133

[@hicat9923]

Wht the name of tutorial should i find in KZbin to make video like this when video is being background from transparent code edito? There's anyone can answer my question here? Thanks in advance 😊

[@adnanrruka5152]

What a quality of videos!

[@axelb423]

Is it possible to rendre à VueJs composent with markdown syntaxe using remark?