Mastering TypeScript in VS Code

It’s another potluck! In this episode, Scott and Wes answer your questions about VSCode, Vercel vs Netlify, staying up to date with dev concepts, models and mutations, websites vs seb apps, adaptive vs responsive design, and more!

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax and put SYNTAX in the “How did you hear about us?” section.

Sentry - Sponsor

If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting Sentry.io and using the coupon code TASTYTREAT during sign up.

Vonage - Sponsor

Vonage is a Cloud Communications platform that allows developers to integrate voice, video and messaging into their applications using their communication APIs. Whether you’re wanting to build video calls into your app, create a Facebook bot, or build applications on top of programmable phone numbers, you’ll have all the tools you need. Use promo code SYNTAX10 for €10 of free credit when signing up at vonage.dev/syntax.

Show Notes

02:10 - Sometimes in VSCode when intellisense tells us the TypeScript type of a variable, it just gives the name of the type rather than how the type is defined. This is annoying for objects as I want to know what fields it contains! How do you handle this? Is there some VSCode magic to make it show the full type definition or is there some way to bring up the definition in the .d.ts file?

04:55 - What techniques do you guys use to keep different tech stack requirements fresh between projects?

10:35 - How do you feel about Vercel vs. Netlify? Pros/cons? Thanks!

18:32 - Should a model name be singular or plural?

22:57 - I’ve just listened to the CSS Typography and Systems Hasty Treat, and realized that we often try to apply website design to web apps (me at least). Can you elaborate on the differences in designing for a website and for a web app?

25:46 - What’s the difference between adaptive and responsive design?

32:40 - Multi-vendor platforms? Have you done it before? A partner and I, are planning to build a peer-2-peer platform (similar to Etsy and Amazon, where users can register as a merchant or a buyer). What is the easiest way to make payment transactions (Stripe or PayPal)? Do you know any frameworks that will make my life easier?

36:16 - Is there a golden rule for mutations? I’ve been using GraphQL for last couple of months, and everything is great as long as I’m just fetching data. When I need to write mutations, the story gets murky. Looking around internet, there are not too many best practices to be found - most of the articles and blogs focus on data fetching.

42:19 - What do you think about the future of Svelte? I know they are replacing Sapper with SvelteKit, which uses Snowpack. What direction do you think Svelte will go in?

45:32 - How can I get back into a habit of learning new things and stop heavily relying on video tutorials all the time? I really struggle to sit down and read for long periods of time. Also have you guys came across the Genesis framework, and if so, could you recommend any learning material? Thanks.

48:54 - My team uses handlebars templates for generating newsletters. The content is coming from a CMS for generating final HTML. I’m fairly new to handlebars and mustache syntax, so instead of learning handlebars I’m thinking about using React to generate the html on server side. I see some great potential here as the entire team is well-versed with React. What is your opinion about this?

Links

• VSCode Peek Definition
• Obsidian
• Render
• Adam Wathan
• Gumroad
• Braintree
• MJML
• https://github.com/unlayer/react-email-editor
• Redwings shoes

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Tosowoong Enyme Powder Wash
• Wes: Carhartt Gloves

Shameless Plugs

• Scott: Testing with Cypress - Sign up for the year and save 25%!
• Wes: Advanced React Course - Use the coupon code ‘Syntax’ for $10 off!

Tweet us your tasty treats!

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets