Syntax - Tasty Web Development Treats

Latest Episodes:

What is Bun? The New JS Runtime Jul 25, 2022

Show notes

In this Hasty Treat, Scott and Wes talk about Bun, a new all-in-one JavaScript runtime. What makes Bun so fast? What’s on Bun’s roadmap? And why do we need another JavaScript runtime?

Lightstep Incident Response - Sponsor

Streamline on-call, collaboration, incident management, and automation with a free 30-day trial of Lightstep Incident Response, built on ServiceNow. Usage-based pricing on active services promotes collaboration across your entire team to build a culture of service ownership. Listeners of Syntax will also receive a free Lightstep Incident Response T-shirt after firing an alert or incident.

Pay for the services you use, not the number of people on your team with Lightstep Incident Response, built on ServiceNow. Streamline on-call, collaboration, incident management, and automation with a free 30-day trial. Fire an alert or incident today and receive a free Lightstep Incident Response t-shirt.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

00:23 Welcome
01:21 Sponsor: Freshbooks
02:07 Sponsor: Lightstep Incident Response
03:20 What is Bun?
Bun
Deno
08:20 Why is Bun so fast?
Zig
12:32 Module support
15:11 What’s not implemented yet in Bun?
What’s not implemented in Bun yet
17:01 Config file in toml
18:08 Bun roadmap
Bun roadmap
20:27 Why do we need another JavaScript environment?

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

Supper Club × Adam Cowley and Neo4j Database Jul 22, 2022

Show notes

In this supper club episode of Syntax, Wes and Scott talk with Adam Cowley about how Neo4j Database can help when working with data for your next app.

Gatsby - Sponsor

Today’s episode was sponsored by Gatsby, the fastest frontend for the headless web. Gatsby is the framework of choice for content-rich sites backed by a headless CMS as its GraphQL data layer makes it straightforward to source website content from anywhere. Gatsby’s opinionated, React-based framework makes the hardest parts of building a performant website simpler. Visit gatsby.dev/syntax to get your first Gatsby site up in minutes and experience the speed. ⚡️

Lightstep Incident Response - Sponsor

Show Notes

00:15 Welcome
01:24 Guest introduction
03:15 Browser innovation and testing
05:01 What is a graph database?
Neo4j Cypher
Sanity Groq
08:11 Is there a specific type of data that works best in a graph database?
11:57 Sponsor: Lightstep Incident Response
13:14 What’s AuraDB vs Neo4js?
15:01 Whiteboard friendly data model
19:52 How are GraphQL and graph related?
23:08 Can you sync with MongoDB?
24:41 How do you pull data into a div on the web?
29:19 Why are you used for data science a lot?
30:43 Sponsor: Gatsby
31:51 Is visualization an important part of Neo4js?
Neo4j Bloom
36:01 Do you have to think about indexing with graph databases?
39:43 Are there uses Neo4j isn’t as good for?
40:22 Do you have to cache queries?
41:26 Dessert questions
Intellijet Idea
Cobalt 2 Theme
50:36 Shameless Plug
Neo4j Desktop
Neo4j Cloud
54:45 ××× SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Hue Lights

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

Our Code Styles Jul 20, 2022

Show notes

In this episode of Syntax, Wes and Scott talk about their coding styles - functional vs object oriented, interfaces vs types, tabs vs spaces, should comments exist? And a whole lot more.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

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.

Sanity - Sponsor

Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at sanity.io/create. Get an awesome supercharged free developer plan on sanity.io/syntax.

Show Notes

00:07 Welcome
01:56 Functional vs object oriented
03:49 Interfaces vs types
05:38 Tabs vs spaces
07:02 Semicolons vs no semicolons
08:10 Let vs const
09:33 Do you explicitly type or allow TypeScript do it’s magic?
11:26 Naming variables
Naming convention for programming
15:13 Methods of looping
18:03 if statement curlys
20:57 Naming files
24:46 Inline testing vs running test as a process
25:31 Sponsor: Freshbooks
26:37 CSS property:val; or property: val;
27:40 CSS nesting?
29:49 Alphabetizing CSS properties
31:11 Rems, Ems, PX, Etc…
33:37 How do you center something in CSS?
35:22 How do you make something 100% height?
36:52 Sponsor: Sentry
37:30 Should comments exist?
Better Comments
Wes’ custom parser for VS Code
Todo Tree
42:31 Creating HTML
45:28 Components in app or in isolation?
47:41 Sponsor: Sanity
48:45 Single component per file vs multiple
Storybook
50:22 Naming components
51:19 General stuff
53:55 ××× SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Scott: Scott’s iPad case for kids
Wes: Garbage can with custom bags.

Shameless Plugs

Scott: LevelUp Tutorials
Wes: Wes Bos Tutorials

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

STUMP’D Interview Coding Questions Jul 18, 2022

Show notes

In this Hasty Treat, Scott and Wes try to stump each other with coding interview questions like what is a higher order component? What is functional programming? And more!

Sentry - Sponsor

Lightstep Incident Response - Sponsor

Show Notes

00:26 Welcome
01:47 Sponsor: Lightstep Incident Response
03:00 Sponsor: Sentry
04:10 What is a higher order component?
05:34 What is functional programming?
09:00 What’s the purpose of cache busting and how do you achieve it?
Wes’ course for Beginner JavaScript
10:37 What is short circuit evaluation?
13:19 What is a closure?
15:49 What is the reason for wrapping the contents of a JavaScript source file in a function that is then invoked?
17:30 Can you describe how CSS specificity works?
20:15 How does prototypal inheritance differ from classical inheritance?
23:56 What is the difference between a parameter and an argument?

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

Supper Club × 70,000 Serverless Functions with Kristi Perreault of Liberty Mutual Jul 15, 2022

Show notes

In this supper club episode of Syntax, Wes and Scott talk with Kristi Perreault of Liberty Mutual about why they’re using serverless functions, what languages they write in, managing security and montoring, and Kristi’s journey into tech as a career.

Hasura - Sponsor

With Hasura, you can get a fully managed, production-ready GraphQL API as a service to help you build modern apps faster. You can get started for free in 30 seconds, or if you want to try out the Standard tier for zero cost, use the code “TryHasura” at this link: hasura.info. We’ve also got an amazing selection of GraphQL tutorials at hasura.io/learn.

Stack Overflow Podcast - Sponsor

For over a dozen years, the Stack Overflow Podcast has been exploring what it means to be a developer, and how the art and practice of software programming is changing our world. Hosted by Ben Popper, Cassidy Williams, and Ceora Ford, the Stack Overflow Podcast is your home for all things code.

Listen to new episodes twice a week, wherever you get your podcasts.

Lightstep Incident Response - Sponsor

Show Notes

00:33 Welcome
03:24 Guest introduction
@kperreault95
Kristi Perreault on Dev.to
Kristi Perreault AWS Hero
Liberty Mutual
04:55 Developers at Mutual Liberty
07:05 What did you do before serverless functions?
08:36 Why are you using serverless functions?
12:39 What languages are you writing for serverless functions?
15:53 Sponsor: Hasura
17:22 Where does all the code live?
20:58 AWS CDK
AWS CDK
CDK Workshop
25:55 Sponsor: Lightstep Incident Response
27:07 How did you get into tech?
31:44 How do you organize all the functions?
33:51 How important is security?
35:23 What are IM roles?
36:16 How do you deal with spiking and monitoring?
Datadog
Splunk
41:20 Sponsor: Stackoverflow Podcast
42:02 Have you used Edge functions?
42:50 Supper Club Questions Off by None newsletter Ready Set Cloud

××× SIIIIICK ××× PIIIICKS ×××

Loki on Disney+

Shameless Plugs

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

Potluck - Peer Dependencies × Vitest × NVM and PNPM × Sprites Jul 13, 2022

Show notes

In this potluck episode of Syntax, Wes and Scott answer your questions about peer dependencies, Vitest, NVM and PNPM, using sprites for images, common MongoDB operations, and more!

Prismic - Sponsor

Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at prismic.io/syntax.

Sanity - Sponsor

LogRocket - Sponsor

LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at logrocket.com/syntax.

Show Notes

00:03 Welcome
01:53 Configuring home internet routers
04:42 Scott’s Home Assistant update
Mushroom Theme
07:52 Could you explain to me peer-dependencies and how does it work?
13:24 Using Vitest do you still have to transpile code?
16:14 Can you talk about helpful and common MongoDB operations, beyond just CRUD.
18:49 How can I update the “updatedAt” field of the document on every save automatically?
20:40 What is aggregation, and when do you use it?
25:33 Sponsor: Prismic
27:27 How does NVM relate to PNPM?
pnpm
nvm
30:45 I’m looking to upskill from front-end JavaScript?
33:53 Is it possible to have a private NPM repo I can “npm install” from, or do I put my components up on NPM publicly?
Creating a private npm package
37:51 Sponsor: LogRocket
39:14 Should a majority of lodash functions be considered deprecated?
angus c just
42:36 Please do an episode on programming/learning with ADHD.
44:04 Should I still be putting images in sprites?
49:20 Does Mux have a simple mechanism for adding auth to each video or group of videos?
Mux Create playback restriction
53:48 Sponsor: Sanity.io
55:02 Is there copyright issues with using public APIs?
Moneypuck
59:38 ××× SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Scott: Toto Bidet
Wes: Sodastream

Shameless Plugs

Scott: LevelUp Tutorials
Wes: Wes Bos Tutorials

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

Clamp & Interpolate Jul 11, 2022

Show notes

In this Hasty Treat, Scott and Wes talk about clamp and interpolate and how you might want to use them in your next project.

Sentry - Sponsor

NAME - Sponsor

There are hundreds of payments processing companies out there. Hit up developer.paymentshub.com/syntax to learn more about how Payments Hub Developers not only processes ecommerce and in-person payments, but also boards and underwrites your merchants in as little as 90 minutes. We are currently offering Syntax listeners who become new partners 6 months free data through our Business Reporting API!

Show Notes

00:25 Welcome
00:52 Sponsor: Sentry
01:31 Sponsor: Payments Hub
02:40 Topic introduction
05:05 What is Clamp?

CSS clamp: font-size: clamp(1rem, 10vw, 2rem);

JavaScript Clamp: const clamp = (num, min, max) => Math.min(Math.max(num, min), max)

09:12 What is Interpolate?
D3 Interpolate
12:56 Interpolate in colors
14:37 Quantize
D3 Quantize

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

Supper Club × Voice Coding with Pokey Rule Jul 08, 2022

Show notes

In this supper club episode of Syntax, Wes and Scott talk with Pokey Rule about using his voice to code, and the current state of voice coding software.

Stackoverflow Podcast - Sponsor

Listen to new episodes twice a week, wherever you get your podcasts.

directus - Sponsor

Directus is an open-source data platform that instantly layers on top of any SQL database. Our Data Engine empowers engineers with dynamic REST+GraphQL APIs, workflow automation, built-in auth, caching, and asset transformations. And the included Data Studio democratizes your database, allowing even non-technical users to browse, manage, and visualize database content through a no-code data collaboration app.

Get started in minutes with a free Directus Community Cloud project.

Show Notes

00:33 Welcome
01:35 Guest introduction
Con 2021 - Cursorless: keyboards and mice are sooo last year!! by Pokey Rule
Emily Shea
05:12 How does coding with your voice work?
Talon Voice
Cursorless Talon
09:45 How do you handle triggering wrong words?
11:41 Sponsor: The Stack Overflow Podcast
12:26 Example of voice coding
Parrot
14:21 What are the noises you make for?
24:29 Working on multiple lines at the same time
27:37 How do you decide where the hats go?
31:18 Sponsor: directus
32:59 What is the community of users like for this?
Tree Sitter
“Incremental, zero-config Code Nav using stack graphs” by Douglas Creager
35:20 Does eye tracking work?
36:48 What kind of mic do you use?
DPA Microphone
The Voice Book
39:25 Supper Club questions
Dark Abyss VS Code theme
Kinesis Freestyle 2
Charybdis Nano keyboard
Nexstand
Arxiv Sanity
Subvocal Recognition
Imagen Research
Midjourney
54:11 ××× SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Git Imerge

Shameless Plugs

Scott: LevelUp Tutorials
Wes: Wes Bos Tutorials
Pokey: YouTube channel, Sponsor Pokey on GitHub

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

10 years of Speaking + Conferences Jul 06, 2022

Show notes

In this episode of Syntax, Wes and Scott talk about their experiences speaking at conferences, why they’ve done it, how they prepare talks, and tips for anyone interested in wanting to give talks.

Linode - Sponsor

Whether you’re working on a personal project or managing enterprise infrastructure, you deserve simple, affordable, and accessible cloud computing solutions that allow you to take your project to the next level. Simplify your cloud infrastructure with Linode’s Linux virtual machines and develop, deploy, and scale your modern applications faster and easier. Get started on Linode today with a $100 in free credit for listeners of Syntax. You can find all the details at linode.com/syntax. Linode has 11 global data centers and provides 24/7/365 human support with no tiers or hand-offs regardless of your plan size. In addition to shared and dedicated compute instances, you can use your $100 in credit on S3-compatible object storage, Managed Kubernetes, and more. Visit linode.com/syntax and click on the “Create Free Account” button to get started.

Sentry - Sponsor

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

00:02 Welcome
01:38 Stanley Cup update
03:13 Legoland update
04:09 Topic introduction
Nicole Sullivan
Tweet looking for questions
05:03 Why speak at conferences?
08:56 Travelling for free
09:50 Getting paid to speak at conferences
12:23 Doing in person workshops
14:55 How do you get into speaking?
19:25 Meetups
20:30 Sponsor: Linode
21:15 What should you speak about?
26:27 Something you did a deep dive on
29:21 Sponsor: Freshbooks
30:04 Flight protection and travel insurance
32:59 Idea: update to a library
33:28 How to get conferences to invite you to speak?
36:03 How do you prepare for a talk?
42:40 How to find conferences looking for speakers
44:09 How to create a topic that will get picked
46:59 Sponsor: Sentry
48:06 Software for your slides
Slides.js
Slides.com
MDX Deck
Notion
Figma
Google Slides
Lydia Hallie
Keynote
56:28 ××× SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Scott: Risk for iOS
Wes: Barrina LED T5 Integrated Single Fixture

Shameless Plugs

Scott: LevelUp Tutorials
Wes: Wes Bos Tutorials

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

CSS5 Color Functions Jul 04, 2022

Show notes

In this Hasty Treat, Scott and Wes talk about new CSS color functions, and tips for viewing the different options and ways of presenting color that are coming.

Linode - Sponsor

Show Notes