Setup VSCode like a senior React developer

Подписаться 91 тыс.

Просмотров 48 тыс.

50% 1

Join The Discord! → discord.cosdensolutions.io
Snippet File → github.com/cosdensolutions/co...
VSCode Theme | Font → Material Theme Darker | Menlo, Monaco "monospace"
It's finally time that I share with you all my VSCode setup as a senior React developer. I share the snippets I use, the extensions I use, and the many quality of life improvements I setup to make working with React daily a joy. If you want to be a senior React developer, you should definitely check out this VSCode setup!

Опубликовано:

28 июл 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 75

@tislam100 8 месяцев назад

Thank you so much for the snippet file, its a game changer. I have been coding in vsCode for the past 4 years and had no clue that you can define your own custom snippets.

@beyourahi 9 месяцев назад

the extensions part was a life saver, thank you so much

@harag9 9 месяцев назад

Thanks for the video, I have quite a few extensions already, but now adding 2 more to the list. Pretty Typescript and Template string. Thanks for these.

@cosdensolutions 9 месяцев назад

nice, enjoy!

@Gilderbrant 9 месяцев назад

multiple cursor case preserver is a really nice addition. thank you 👍

@deepakkashyap6538 9 месяцев назад

Great insight !! this will actually improve developer productivity

@saqibmuhammad7218 9 месяцев назад

The way of your teaching inspires alot🥰 i watch your video to make me more motivated to learn new things 😍

@cosdensolutions 9 месяцев назад

thank you for the kind words!

@dimakolyas916 2 месяца назад

Snippets and Extensions was new for me. Thank you !

@ByteNatives 9 месяцев назад

Just one word Splendid!!

@HenryBabbage 9 месяцев назад

great extensions, thanks!

@user-to2go8rw6w 9 месяцев назад

Great tips. Thank you.

@marceloviannadev 7 месяцев назад

You can make your snippet component even better by setting to get the name of the new file you're created. Multiple cursor + template string are life changers! This comes to my mind today but, I forgot to search for it after work... 🤘🏻

@Wydder 6 месяцев назад

Nice, unique and usefull extensions

@brunopagno 9 месяцев назад

Excelent video!

@Offiziersmesser 9 месяцев назад

kwool stuff as always😄

@prashlovessamosa 9 месяцев назад

Thanks for sharing.

@mehmetisk5803 9 месяцев назад

thannks this is really helpful ;)

@bobdpa 9 месяцев назад

Awesome 💯

@leonardmbibi8013 9 месяцев назад

Bravo!

@angelogaspar364 5 месяцев назад

Thank you so muchhhhhhhh !!!!

@colbatronbmw 9 месяцев назад

template string converter! that is so dope.

@bubuu32221 8 месяцев назад

Lovee it

@ayushyapatel8645 9 месяцев назад

hey can you share your settings.json file so I can replicate my workbench

@jspesh 5 месяцев назад

Can you do a video about running multiple projects in VSCode? I have really struggled to get both my UI layer (React app) and API (C# .net core app) to run from vscode but both work in Visual Studio. Of course, vscode is wayyyy better for React development and i miss things like prettier, shortcuts/snippets and various other bits

@av03 8 месяцев назад

Hi, how to enable the snippets?

@RAQS90 9 месяцев назад

9:26 I believe the "Template String Converter" behavior is now built into the VS Code.

@cosdensolutions 9 месяцев назад

oh really? that would make sense, thanks for the tip!

@cidhighwind8590 9 месяцев назад

Where to find the setting, I can't find it and it does not automatically do it on my VS code by default.

@harag9 9 месяцев назад

Really. can you let us know how to set this up, because mine doesn't do it. I do have an extension that "toggles" the quotes between the 3 different types, but the template string converter is much better since that is why I'm toggling.

@LuisDa20 8 месяцев назад

you should show your keybindings and you setup for vscode vim, that is actually the more important

@cosdensolutions 8 месяцев назад

I use the defaults

@onta.nicolae 8 месяцев назад

what vim extension do you use? and how did you configure it? im having some issues with them and it seems like its not very practical for react

@cosdensolutions 8 месяцев назад

I just use the vim extension from vscode, no other configurations just the default! I only use it for navigation and a few specific keys

@onta.nicolae 8 месяцев назад

@@cosdensolutions thank you

@rahulj8502 8 месяцев назад

one thinkg i am not able to do is, the color highlighting fo the hook, how is that the setter function on the use state hook gets different color

@cosdensolutions 8 месяцев назад

It's when vscode knows it's a function! It depends on the theme and you need to use typescript I believe

@vishavranta8813 9 месяцев назад

HI loved the video, could you share the text file for custom snippets, Thanks

@cosdensolutions 9 месяцев назад

done, check description

@RazAm8 3 месяца назад

theme?

@Berbersky15 16 дней назад

// It came with ` ` avoiding to write it "Console Log": { "prefix": "cl", "body": [ "console.log(`$1`);" ] },

@damagee8141 9 месяцев назад

I suppose you have the business version of copilot since you can chat with the ai?

@cosdensolutions 9 месяцев назад

I think so? I have the normal subscription but I did get access to it a while back

@cordial 9 месяцев назад

is the snippets file something you wouldn't mind sharing?

@cosdensolutions 9 месяцев назад

sure, check description!

@cordial 9 месяцев назад

thanks!@@cosdensolutions

@tinodueppotell4869 9 месяцев назад

VSCode or Webstorm is a good Choice for beginners, but not for senior developer in my opinion, vim with tmux is for me the best choice.

@Berbersky15 16 дней назад

Better version of useState that uppercase the variable name : "React useState": { "prefix": "us", "body": [ "const [$1, set${1/(.*)/${1:/capitalize}/}] = useState($2);" ] }

@_bijaydas 9 месяцев назад

I use the snippets too, but I don't like the way snippets are created.

@cosdensolutions 9 месяцев назад

Yeah I get it, it's a bit cumbersome

@michamazurkiewicz80 8 месяцев назад

In Poland we say more tools than talent. Extensions and theme will not mąkę you code like senior dev 😅

@CheezePie 9 месяцев назад

I just came here to say that I use neovim😂

@khashayarghajar 9 месяцев назад

senior React developer are only use vim 🗿

@webixr 9 месяцев назад

I know that the topic has nothing to do with the video, but for humanity. Recently, Israel bombed a house in southern Gaza, killing at least 10 people - 7 of them children. So far, the number of killers in Gaza has exceeded 3,500 dead, most of whom are children and women. I hope that To have a voice in this for humanity

@macroyal2002 9 месяцев назад

While hamas killed raped tortured hundreds of civilians including babies. Raped babies - just to be clear. Also they tried to shoot a rocket at Israel and it fell near a hospital in Gaza. Israel has the right to defend itself 🇮🇱🇮🇱🇮🇱.

@7days280 9 месяцев назад

What about Hamas releasing 5k rockets in israel? Not taking sides but It's a war now. Both sides will take damage

@sambegstha3516 9 месяцев назад

Not here bro pls. I know it's bad out there but we barely know anything about the history to even have an opinion.

@webixr 9 месяцев назад

Thank you for your response. I know that the place is not appropriate, and this is what I mentioned at the beginning of the letter, but it is necessary to clarify the ugliness of what Israel is committing, and the media is basically for the Jews, so it misleads information, and as for history, your lack of knowledge of it, my brother, does not change it. it's clear. 5 minutes of your time searching and you will discover the truth hidden from us. I hope you will research and spread awareness among those around you. Thank you😊

@sidarthg2477 9 месяцев назад

@@sambegstha3516same here. As far I know, the history of the conflict dates back to events around 1000 years back. So discuss it in forums dedicated to the conflict