Tap to unmute

10X Your SvelteKit Developer Experience in VSCode

  Рет қаралды 39,529

Huntabyte

Huntabyte

Күн бұрын

Пікірлер: 107
@JoyofCodeDev
@JoyofCodeDev 2 жыл бұрын
This is almost exactly the same video I wanted to make. One thing I would love for VS Code is to have an adjustable line height for the explorer because it's hard to parse the project structure sometimes and increasing the indentation helps but I would also like to increase the line height.
@philippsteinke5694
@philippsteinke5694 2 жыл бұрын
every comment got a heart but yours! :(
@jordancalhouncom
@jordancalhouncom 2 жыл бұрын
Totally agree with you, this has always been a pain point for me in VS Code, ,apps like Nova do a much better job at this layout - alas that app is full of its own issues, esp for Svelte devs
@Huntabyte
@Huntabyte 2 жыл бұрын
@Phillip I hadn’t checked all the comments yet!
@Huntabyte
@Huntabyte 2 жыл бұрын
I completely agree! I wonder if possible via an extension of some sort? I’m sure a lot of people would benefit!
@dand4485
@dand4485 Жыл бұрын
Might be nice if someone does this, might be me but just seems to make sense there would be a file height and a directory/folder height gap? Just thinking it might be nice to have 2x or 3x the file height gap to help see the separations between the files in one folder vs another?
@coderwolfie2201
@coderwolfie2201 2 ай бұрын
wow you made vs code better. I never knew these settings existed or that I needed them.
@SRG-Learn-Code
@SRG-Learn-Code 2 жыл бұрын
00:00 Intro 00:14 Tab label format 01:08 Explorer sort files first 02:38 Compact folders 03:23 Material Icons #43a047 04:23 Tree indent 05:17 Extensions 07:21 Navigation 08:29 Svelte Discord 09:22 Outro
@Huntabyte
@Huntabyte 2 жыл бұрын
Thank you!
@andrew.derevo
@andrew.derevo 6 ай бұрын
Thanks! helps me a lot ❤
@asatorftw
@asatorftw Жыл бұрын
Just got into SvelteKit recently and you solved some problems for me. Earned my sub!
@ra-v-y
@ra-v-y Жыл бұрын
Great video. I'm learning SvelteKit from your practical videos. In this video you mentioned that you could not get used to the "Explorer: Files First" concept. I had the same until I discovered the "Explorer › File Nesting: Patterns". The patterns that help me clean up the individual files that clutter the tree before the folders. Item: package.json Value: playwright.config.ts, pnpm-lock.yaml, postcss.config.cjs, svelte.config.js, tailwind.config.cjs, tsconfig.json, vite.config.ts, .eslintignore, .eslintrc.cjs, .npmrc, .prettierignore, .prettierrc Item: +layout*.svelte Value: ${basename}*.ts Item: +page*.svelte Value: ${basename}*.ts
@hamburgerfatso
@hamburgerfatso Жыл бұрын
what does that do?
@JamesQQuick
@JamesQQuick 2 жыл бұрын
This was an awesome video. Thanks so much for sharing these tricks!
@dziugasbizokas5359
@dziugasbizokas5359 11 ай бұрын
Watched a lot of your tutorials, they're great! Much love for putting the effort in all of this, keep it up! :3
@maskman4821
@maskman4821 2 жыл бұрын
This is a valuable lesson, these shortcut / tricks make Sveltekit development easier and enjoyable, I particularly like No.1 and No.3 settings, very useful, practical and minimize the confusion, thank you so much 🙏
@Huntabyte
@Huntabyte 2 жыл бұрын
You’re very welcome!
@romer-dev
@romer-dev 10 ай бұрын
Thank you, this is very helpful as beginner in sveltekit even though its my first time using svelte the settings made my vsc more productive
@everyhandletaken
@everyhandletaken Жыл бұрын
whoah.. that first tip, why did I not know about this before?! sooo helpful !!
@Huntabyte
@Huntabyte Жыл бұрын
It's a game changer especially when you don't have the explorer open!
@everyhandletaken
@everyhandletaken Жыл бұрын
@@Huntabyte absolutely! Really useful & several other tips adopted from this video, thank you 😊
@AlexUnderCMYK
@AlexUnderCMYK Жыл бұрын
Great content and video production, no BS and all pretty clear. Thanks
@Huntabyte
@Huntabyte Жыл бұрын
You’re welcome!
@ScriptRaccoon
@ScriptRaccoon Жыл бұрын
Awesome tips! I am excited to use the SvelteKit snippets.
@Huntabyte
@Huntabyte Жыл бұрын
I make snippets for so many things now!
@budivoogt491
@budivoogt491 Жыл бұрын
Great video! Loved the displaying of file path in the tabs.
@bmehder
@bmehder 2 жыл бұрын
Tip #1 === pure gold!
@Huntabyte
@Huntabyte 2 жыл бұрын
I agree - it's certainly a gamechanger!
@hnazmul
@hnazmul Жыл бұрын
its really an beneficial video. and these are very rare tips. very few people give tips like him. Thank you man.
@Huntabyte
@Huntabyte Жыл бұрын
You're very welcome!
@iPankBMW
@iPankBMW 2 жыл бұрын
Thanks for videos on new and hyped topics so early :) I live how we can adapt VSCode tips for Nextjs13 aswell :) Thanks!
@Huntabyte
@Huntabyte 2 жыл бұрын
You’re very welcome!
@naranyala_dev
@naranyala_dev 2 жыл бұрын
Awesome, waiting for the next 10x tips
@mannuelf
@mannuelf Жыл бұрын
Thank you sir, this is awesome.
@Huntabyte
@Huntabyte Жыл бұрын
You're very welcome!
@Jorge78712
@Jorge78712 2 жыл бұрын
Great video!! Very helpful thanks!!
@Huntabyte
@Huntabyte 2 жыл бұрын
You’re welcome!
@gorandamchevski
@gorandamchevski 2 жыл бұрын
Great video, thanks for the tips!
@rossvold
@rossvold 2 жыл бұрын
Thanks for the tips Huntabyte!
@Huntabyte
@Huntabyte 2 жыл бұрын
You're very welcome!
@BoukeGroenescheij
@BoukeGroenescheij 2 жыл бұрын
Very nice video and tips - very helpful; I like them all!
@Huntabyte
@Huntabyte 2 жыл бұрын
I’m glad to hear that!
@Noritoshi-r8m
@Noritoshi-r8m Жыл бұрын
Very useful stuff, many thanks.
@senseicodes
@senseicodes 2 жыл бұрын
Great video as always!
@Huntabyte
@Huntabyte 2 жыл бұрын
Thank you!
@frederikclement7795
@frederikclement7795 2 жыл бұрын
great tips, thank you!
@Huntabyte
@Huntabyte 2 жыл бұрын
You're welcome!
@garmendash3726
@garmendash3726 2 жыл бұрын
Nice video, now I have to watch it
@itspaulinamac
@itspaulinamac 2 жыл бұрын
A great video as always! Thanks for the tips!
@0791679
@0791679 2 жыл бұрын
Tnx for the tips , although I knew 7 from 10 but the 3 ones was very good
@Huntabyte
@Huntabyte 2 жыл бұрын
Glad to hear that!
@Mrg-z3q
@Mrg-z3q 2 жыл бұрын
Awesome video ! hopefully svelte will become more popular than react one day
@Huntabyte
@Huntabyte 2 жыл бұрын
It's possible but certainly a good amount of time away.
@iteammy
@iteammy 2 жыл бұрын
Great video, Thank you
@Huntabyte
@Huntabyte 2 жыл бұрын
Thank you! You're very welcome!
@alittlegreyhair1104
@alittlegreyhair1104 2 жыл бұрын
Really useful, thank you.
@Huntabyte
@Huntabyte 2 жыл бұрын
You’re very welcome!
@cedigasser
@cedigasser 2 жыл бұрын
Great video! Some of those tips apply to vs code in general, you could do a video on how to work more efficient with vs code in general.
@Huntabyte
@Huntabyte 2 жыл бұрын
Great suggestion!
@marlopainter8246
@marlopainter8246 Жыл бұрын
I kinda like tip #2 as it puts all the files you rarely go into after project setup at the top and out of the way. I understand how you didn't like it, but I will also give it a try. #3 - omg I hated that, thank you!
@marlopainter8246
@marlopainter8246 Жыл бұрын
UPDATE - I coupled Tip #2 with a `Hide Files in Explorer` extension to get rid of the files I never open... and I don't think I can go back now. I opened Webstorm after making these changes to VS Code, and I was angry, lol. I just closed it and went back to VS Code, instead of configuring Webstorm. I've also gone in and tweaked indent, line height, added padding to the top of the editor, setup the icons... I love VS Code now. Thanks again for the video.
@szigyartom
@szigyartom 10 ай бұрын
I tried files first too, but it's much better to set hidesExplorerArrows to true. The arrows are ruining the whole thing visually.
@nijinnazar2160
@nijinnazar2160 Жыл бұрын
Awesome ❤
@Huntabyte
@Huntabyte Жыл бұрын
Thank you! Cheers!
@it-s-me-mohit
@it-s-me-mohit 2 жыл бұрын
Great video 👌👌
@Huntabyte
@Huntabyte 2 жыл бұрын
Thank you!
@twd2
@twd2 2 жыл бұрын
love it 😍
@Huntabyte
@Huntabyte 2 жыл бұрын
I'm glad that you do!
@frosty2912
@frosty2912 Жыл бұрын
Most tip videos are not that good but this one had some really great tips that I applied to my setup immediately. Thank you!
@Huntabyte
@Huntabyte Жыл бұрын
Glad it was helpful!
@jordancalhouncom
@jordancalhouncom 2 жыл бұрын
*EDIT* That feature is included with the File Utils extension In the extensions section with those 3 installed the right click "Sveltekit files" is not listed for me. Is it possible this is included in another extension? thanks for the great video!
@Huntabyte
@Huntabyte 2 жыл бұрын
Oh really? I thought it was a part of the Svelte for VSCode extension.
@nazuu
@nazuu Жыл бұрын
Thanks bud :)
@Huntabyte
@Huntabyte Жыл бұрын
You’re welcome!
@aanes1dev869
@aanes1dev869 2 жыл бұрын
this is gold!!
@Huntabyte
@Huntabyte 2 жыл бұрын
Thank you!
@rubickthegrandmagus137
@rubickthegrandmagus137 Жыл бұрын
I can't seem to find that SvelteKit File in my context menu
@rubickthegrandmagus137
@rubickthegrandmagus137 Жыл бұрын
Found it in extension settings. Hope you include it on your next video to help noobs like me. Thanks
@nobodyshomeuk
@nobodyshomeuk Жыл бұрын
VS Code really needs to make a sort order for filesFirstExcludingRoot. I love the root folders up top but also love the files at the top of nested folders. Shame i can't have both :(
@Huntabyte
@Huntabyte Жыл бұрын
I agree!
@bozidarbralic1937
@bozidarbralic1937 2 жыл бұрын
Would be great if you did a video on Error handling with hooks in SvelteKit. I've got a real problem at work concerning Error handling and if you'd consider it I would be very grateful. Ex. HandleClientError. Thank you for the great and up-to-date series on Sveltekit
@YuGoCheff
@YuGoCheff 2 жыл бұрын
Error handling is big and important thing for everyone, so would also appreciate a video (series) on it ! :)
@babyfeavel71
@babyfeavel71 2 жыл бұрын
very good
@Huntabyte
@Huntabyte 2 жыл бұрын
Thank you!
@luminox1
@luminox1 2 жыл бұрын
im with you on the second tip, looks alien to me ahaha. Maybe if was brand spankin new to vscode i might be able to deal with it
@Huntabyte
@Huntabyte 2 жыл бұрын
Facts! Couldn't get past that at all.
@cory2300
@cory2300 2 жыл бұрын
Great tips!!
@xeon7879
@xeon7879 2 жыл бұрын
hello algorithm
@mcdba41
@mcdba41 2 жыл бұрын
tnx
@Huntabyte
@Huntabyte 2 жыл бұрын
You're welcome!
@scott_itall8638
@scott_itall8638 Жыл бұрын
Material Icons theme just reverts to not being installed oddly.
@crowdozer
@crowdozer Жыл бұрын
Wow, almost every one of these so far is something that irks me but I assumed wasn't customizable lol
@Huntabyte
@Huntabyte Жыл бұрын
Glad to hear that!
@ambig1
@ambig1 Жыл бұрын
hmm, after seeing how the face behind the voice of 'daily dose of internet* looks, i am not surprised anymore how he looks.
@christopherhornle4513
@christopherhornle4513 Жыл бұрын
algo :)
@Huntabyte
@Huntabyte Жыл бұрын
Thank you :)
@flogginga_dead_horse4022
@flogginga_dead_horse4022 Жыл бұрын
But I'm using webstorm!!!! 😜
@aramp
@aramp 2 жыл бұрын
comment for the algo
@Huntabyte
@Huntabyte 2 жыл бұрын
Thank you!
@JustBCWi
@JustBCWi 2 жыл бұрын
Should be "how to 10X with VSCode in Sveltekit."
@Huntabyte
@Huntabyte 2 жыл бұрын
Yeah except the last one - so I guess it should be How to 10X with VSCode and Discord in SvelteKit eh?
@j.m.manhard
@j.m.manhard 2 жыл бұрын
Beside the last one this is all just about VS Code. I admit it's pretty commonly used but it's by far not the only one out there and thus framing the video in a general way "Improve DX for Svelte kit" is a bit clickbaity in my opinion. You should narrow it down to be more accurate by adding "in VS Code" or something.
@Huntabyte
@Huntabyte 2 жыл бұрын
If I hadn't included the last one then I would have added 'in VSCode' to the title. I did include it in the thumbnail though as I realize most are relating to VSCode. I know with the latest StackOverflow survey 75% of developers prefer VSCode, and I'd be willing to bet that >90% of web developers prefer it.
@stoobe
@stoobe 5 ай бұрын
Great tips, thanks!
@sefpai424
@sefpai424 2 жыл бұрын
Great video thanks for the tips!
@Huntabyte
@Huntabyte 2 жыл бұрын
You're very welcome!
Build a Reactive Search Filter with Svelte
16:11
Huntabyte
Рет қаралды 26 М.
Protect SvelteKit Routes with Hooks
21:10
Huntabyte
Рет қаралды 61 М.
Quando eu quero Sushi (sem desperdiçar) 🍣
00:26
Los Wagners
Рет қаралды 15 МЛН
How to treat Acne💉
00:31
ISSEI / いっせい
Рет қаралды 108 МЛН
Don’t Choose The Wrong Box 😱
00:41
Topper Guild
Рет қаралды 62 МЛН
Каха и дочка
00:28
К-Media
Рет қаралды 3,4 МЛН
Use Svelte 5 Snippets To Reuse Markup Without Creating Components
17:41
Master The Svelte Context API
18:07
Joy of Code
Рет қаралды 8 М.
Why Your Load Functions are Slow
8:24
Huntabyte
Рет қаралды 22 М.
SvelteKit changed my dev journey
12:26
Nev the Dev
Рет қаралды 547
The Problem with Using Layouts for Auth
7:10
Huntabyte
Рет қаралды 53 М.
Forms Will Never Be the Same
10:10
Huntabyte
Рет қаралды 59 М.
Practical Svelte 5 - Shopping Cart
25:10
Huntabyte
Рет қаралды 21 М.
Svelte 5's Secret Weapon: Classes + Context
18:14
Huntabyte
Рет қаралды 31 М.
Better Protected Route Redirects
7:58
Huntabyte
Рет қаралды 29 М.
Svelte makes Drag And Drop API easy!
15:08
Antonio Sarcevic
Рет қаралды 23 М.
Quando eu quero Sushi (sem desperdiçar) 🍣
00:26
Los Wagners
Рет қаралды 15 МЛН