Syntax - Tasty Web Development Treats - TopPodcast.com

View Top 200 Chart

Back to Rankings Page

Syntax – Tasty Web Development Treats — News
Syntax – Tasty Web Development Treats

Full Stack Developers Wes Bos and Scott Tolinski dive deep into web development topics, explaining how they work and talking about their own experiences. They cover from JavaScript frameworks like React, to the latest advancements in CSS to simplifying web tooling.

Latest Episodes:

20 Easy Win Performance Tips Mar 21, 2018

Show notes

In this episode, Scott and Wes chat about 20 different ways you can improve the perf, speed and overall user experience of your websites.

Cloudinary - Sponsor

Cloudinary is the best way to host, compress and transform your images on the web. Sign up for their free tier and get 10GB of bandwidth for free!

Also check out Cloudinary's ImageCon conference - use the code SYNTAX99 for a discount when checking out.

Fluent Conf - Sponsor

Developers, software engineers, designers, and web performance professionals flock to Fluent in pursuit of a common goal: building a better web. That means delivering fast, secure, accessible experiences to users and customers.

Fluent covers a broad range of technologies and topics to provide web programming professionals with the skills, connections, and inspiration needed to build better online and mobile experiences.

Fluent is this June 11-14 in San Jose, CA. Save 20% today with code: SYNTAX

Show Notes

So many perf tips came in over twitter, so in addition to this podcast I'd recommend you read all the replies to this tweet

0:00

We just cracked 1,000,000 downloads! Thank you!

4:00

Network Tips
Reducing the amount of HTTP requests
A little bit about HTTP2
An interview about http2

8:00

Use Caching and LocalStorage
Turn on aggressive caching on your server - long expire times
What is gzip? / Enabling gzip

12:00

Using a CDN
Listen to our episode on CDNs and #BigZips

13:00

When to load your JS
Blocking Requests

15:00

Use Lazy Loading

17:00

Preloading content with Link rel="preload"
rel="prefetch"

19:00

Picture, picturefill and srcset=""
Article on srcsrc and Picture
srcset vs picture/source elements

25:00

Image Compression
One less jpg
Serve less data

26:00

Inline SVG
Talk about Font Awesome

33:00

CSS and JS Code
Critical CSS

37:00

Remove unused code
Purify CSS
no-unused-imports with ESlint

38:00

Code Splitting

40:00

Transpile less
babel-preset-env

41:00

Tree shaking
Hoyyyy its a tree shaker

42:00

Async ans defer attributes on your script tags
Amazing site that visualizes async and defer

45:00

Icon Fonts
Web Fonts
Native Font Stack:
Good: font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;

47:00

font-display

49:00

Troubleshooting Performance
Simulate Slow Network Speed
Google Page Speed
Wes' Page Speed Video

SIIIIICKkkkkkkkk PIXXXXX

Scott: WiFi Surge Protector
Wes: KitSound Bluetooth Airline Converter

Shameless Plugs

Scott is working on a Vue course!
Wes is working on his Advanced React course!

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

Recording Screencasts - Hardware, Software, Dos and Don'ts Mar 14, 2018

Show notes

In this episode, Scott and Wes everything about their recording — from gear to software to tips and tricks for creating a good screencast.

Netlify — Sponsor

Netlify is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up netlify.com/syntax for more info.

They are also hiring! netlify.com/careers

Freshbooks - Sponsor

If you are a small business or freelancer check out Freshbooks.com Cloud Accountingand get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section.

Show Notes

2:00

4:00

We talk about Different types of microphones
Wes' Hardware:
Heil PR40
Heil PL2T Boom Arm
Audio Technica AT2020
Heil Flush Desk Mount
Scarlet 2i2
DBX 286s Preamp
EQ351 Equalizer
BSW Pop filter for Heil PR40
Heil Shock Mount

14:30

What are the essentials for hardware?
Put a t-shirt under your keyboard

16:00

Once you get to record, what do we use?
Divvy
IShowU Instant
Screenflow
Uberlayer
Loopback

32:00

Making Mistakes
Leaving in goof ups and debugging

40:00

Bad screen recordings
What is boring? What is annoying?
Recording pet peves
Tips for sizing your editor
Gross sounds
Too many files

50:00

What makes a good recording?
Good contrast on colour scheme
Keeping the code open
Short recordings

SIIIIICKkkkkkkkk PIXXXXX

Wes: CD Player Magnet Phone Holder
Scott: OxyLED Motion Sensor 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

Hasty Treat — Freelancing Hot Tips 🔥 Mar 09, 2018

Show notes

In this Hasty Treat (Short episode) we answer your questions about Freelancing - how to charge more, building a portfolio, finding clients and our thoughts on using pre-made WordPress themes.

Sign up for the Value Pricing Bootcamp - Sponsor

Get Jonathan Stark's free 6 day email course on value based pricing for freelancers over at valuepricingbootcamp.com.

Jonathan Stark is the author of Hourly Billing is Nuts and has worked with companies such as Staples, Time and T-Mobile. These days he routinely commands an effective hourly rate of $2000+ per hour, so I'd say you should check his course out.

Show Notes

1:00

Our first episode on Freelancing - how to slam dunk freelancing

4:00

Q: Ideas on building a portfolio and landing those first customers
Your portfolio doesn't really matter as a web developer
Your reputation and referrals is key
Reputation in the community is important
Put yourself out there!
You have to tell people what you do
You have to ask people if they need work
Good communication is key

8:00

Q: What are some strategies for budging and quoting?
Understanding what a website is worth to a client
Talking to your client ablut pricing
Asking how much they have available to spend
Chunking the project into multiple bits so they can build on it

14:00

Q: How do you tell your existing clients that you need to charge more?
Clean Scope / Scope Creep
Quote in Features and pieces, not entire projects
Fixed Pricing
Becoming a better/faster developer
Getting more expensive as you move
Don't charge hourly
Taking big Ls

18:30

Q: What is your opinion on value based pricing?
We're huge proponents
Clients don't like hourly billing
The client should know what you are paying and what you are getting

22:00

Q: When is it okay to use WordPress and pre-made themes? Is that cheating?
The beauty of open source
The business Wes answer
The developer Wes answer
Building your own starter files
Undoing other developer's work

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

Keeping Up with the Codeashians. Dealing with our fast paced industry. Mar 07, 2018

Show notes

Scott and Wes talk about how to deal with being overwhelmed with our fast paced industry. How do you keep you and your team's skills up to date?

Wes' Note: Scott came up with the title for this one. I know.

Netlify — Sponsor

Netlify is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up netlify.com/syntax for more info.

They are also hiring! netlify.com/careers

Freshbooks - Sponsor

If you are a small business or freelancer check out Freshbooks.com Cloud Accountingand get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section.

Show Notes

1:00

WELCOME
Scott is 32! Happy Birthday
Wes Relaunched his React for Beginners course!

4:00

That feeling
Being okay with not knowing everything

9:00

How to wait it out
When you should jump into a library
1.0 of libraries
Dogfooding

13:00

Just In Time learning
Doubling down on the fundamentals

21:00

What is JAM Stack?

22:00

Why do you need to stay up to date?
Moving or Losing Jobs
Comfy Chairs

25:00

Hipster Web Developers

27:00

Someone think of the customers!
Technical Debt
Falling in love with web development again
Constantly challenging yourself

30:00

Complacency in Web Devleopment
Motivating Comfortable Web Developers
You have to stay up to date

32:00

Working on the weekends
Real Talk: part of your job is staying up to date
How to find time to learn on the clock

36:00

Adding new tech to projects as a way to learn

39:00

What if your senior developer is holding back progress?
How to convince your team or boss that you aren't just a hipster and this new tech is worth it
Show them the why!

47:00

Okay, I want to stay up to date. How?
Strong handle on fundamentals
Twitter
Twitter
WebDev Reddit
NodeJS is Cancer
Kitze's LOL Tweet
JavaScript Weekly
Lunch and Learns
Meetups

Siiiiiiiick Pixxxx

Scott: Never Split The Difference
Wes: Containers Podcast

Shameless Plugz

Scott: Pro Gatsby
Wes: React For Beginners

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

Why Static Site Generators are Awesome Feb 28, 2018

Show notes

Wes and Scott talk all about Static Site Generators!

Netlify — Sponsor

Netlify is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up netlify.com/syntax for more info.

They are also hiring! netlify.com/careers

Freshbooks - Sponsor

If you are a small business or freelancer check out Freshbooks.com Cloud Accountingand get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section.

Show Notes

1:00

Woah Scott's Audio!

4:00

#TastyTreats Winners

8:00

What are static site generators?

10:00

Benefits of Static Site Generators
Gatsby
StaticGen.com
Jekyll
Hugo
Hexo

24:00

More complicated apps as static sites
Next.js Static Export
Nuxt.js

34:00

Limitations of a static site
What happens when you need something on the server?
Snipcart for Ecommerce
Algolia
Awestruct
Hot Hot Reloading

41:00

Using with a Headless CMS
Reloading The Pages

48:00

WHAT WHAT Scott is Canadian?!

50:00

Where can you host a Static Site?
Literally Anywhere
Github Pages
Netlify
rsync
WPGraphQL

Siiiiiiiick Pixxxx

Scott: JSRefactor
Wes: Auto Rename Tag

Shameless Plugz

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

Large Files - CDNs, Image Compression, Video Hosting, and Big Zips Feb 21, 2018

Show notes

Scott and Wes talk about working with images, videos and big zips. How do you host them? Do you need a CDN? What about compression?!

Cloudinary

Cloudinary is the best way to host, compress and transform your images on the web. Sign up for their free tier and get 10GB of bandwidth for free!

Also check out Cloudinary's ImageCon conference - use the code SYNTAX99 for a discount when checking out.

Xojo — Sponsor

Xojo is a cross-platform development tool for creating native apps for desktop, mobile, web and Raspberry Pi.

With Xojo you really can write just one version of your app, say, on the Mac, click a button, and have a completely native Windows version too.

Xojo lets you abstract yourself from specific platform details, so you can focus on what makes your app unique. All apps have completely native controls, even if they weren’t developed on that platform. Just use drag and drop to create your user interface, and one language to program the functionality.

Users also include Fortune 500 companies, citizen developers, professional developers, IT, hobbyists and students - anyone who wants to build apps faster.

Listeners of this show get 20% off with the coupon code SYNTAX over at xojo.com/syntax

Show Notes

1:30

Chit-chatting about GraphQL Testing

3:45

What is a CDN? Why do you need one?
How does the internet even work?

7:00

Amazon S3 + Cloudfront
CacheFly
MaxCDN
Cloudflare

11:30

Talking about Image Formats
WebP
WebP CanIUse

16:00

Losslesss VS Lossy
Stripping image meta data like EXIF
Image Optim App
ImageMin
Gulp ImageMin
ImageMin Webpack
ImageMin Plugins on npm

26:00

How we use Cloudinary

29:00

Hosting, Encoding and Compressing Videos
Our Stacks Explained Syntax Podcast
Vimeo Pro
YouTube DL
BrightCove
Wista
Sprout Video
Cloudinary Video

41:00

What is Cloudflare?
Cloudflare Video is coming

46:30

50:00

Big Zips!
How do we host large video downloads?
Amazon S3 + Cloudfront
Handbrake
Backblaze B2

55:00

Video Formats

59:00

SVGO
SVGOMG

Siiick Pixxxx

Wes: Node Inspector Manager
Scott: iShowUInstant

Shameless Plugz

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

Designing, Templating, Inlining and Sending Email! Feb 14, 2018

Show notes

In this show, Scott and Wes talk about about sending both transactional and marketing email. Everything from designing to templating to inlining the CSS to getting it sent. Enjoy!

Freshbooks - Sponsor

If you are a small business or freelancer check out Freshbooks.com Cloud Accountingand get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section.

Xojo — Sponsor

Xojo is a cross-platform development tool for creating native apps for desktop, mobile, web and Raspberry Pi.

With Xojo you really can write just one version of your app, say, on the Mac, click a button, and have a completely native Windows version too.

Xojo lets you abstract yourself from specific platform details, so you can focus on what makes your app unique. All apps have completely native controls, even if they weren’t developed on that platform. Just use drag and drop to create your user interface, and one language to program the functionality.

Users also include Fortune 500 companies, citizen developers, professional developers, IT, hobbyists and students - anyone who wants to build apps faster.

Listeners of this show get 20% off with the coupon code SYNTAX over at xojo.com/syntax

Show Notes

0:00

WELCOME!

2:00

An update on GraphCool, Prisma and Yoga

3:45

Syntax Contest!

You can win a free course from either Scott or Wes by screenshotting yourself listening to the podcast and uploading to Twitter or Instagram.
We will pick 1 winner from Twitter and 1 winner from Instagram
Make sure to tag @wesbos and @stolinski on Twitter and @wesbos and @stolinskion Instagram
#TastyTreats

5:40

Email ain't easy!

6:20

How do Scott and Wes use email in their apps and businesses?
Transactional vs Marketing Email

9:00

Dealing with multiple emails and modifier
Signing in with Facebook vs Email?!

11:00

Transactional Email
The Process to creating single one-off email

13:00

Scott's Setup:
Handlebars
Meteor Email Docs
Mandrill
Wes' Setup
Pug Templating - the artist formerly known as Jade
Juice CSS Inliner
Foundation for Emails
Inky
NodeMailer
Postmark

20:00

Why does email get blocked?
Amazon SES
SendGrid
MailGun
MJML
Email Reputation
MailTrap
MailHog

30:00

Designing Emails
CSS is very limited
MJML React Email Templating
Tony from Twitter also told me about HTML

37:22

Debugging and Testing Emails
Litmus
Email on Acid is way cheaper

45:00

Marketing Emails
MailChimp
Drip

52:00

Host your own Platforms
Sendy
Email Octopus
Mautic
MailTrain

Siiick Pixxxx

Scott: Personal Capital
Wes: Nothing is Sick this week

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

Wes and Scott's Lives - Breakdancing, BBQ, Wives, Work/Life Balance, Problem Solving, YouTube Subscriptions Feb 07, 2018

Show notes

Freshbooks - Sponsor

If you are a small business or freelancer check out Freshbooks.com Cloud Accountingand get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section.

Show Notes

0:00

Goofing Around

1:30

Real show starts

2:12

Scott explains his breakdancing hobby
"Breaking" is breakdancing
What is flavour?

10:20

Wes talks about being into BBQ
World's Longest Yard Sale
Wes has a large Big Green Egg and a MiniMax BGE

19:00

Scott talks about how he is into making music
Domestic Robot
Scott is starting up a new project called "Shift. Super."

21:30

How do you find time for these hobbies?
Avoiding burnout
Work/Life Balance
Buy in from significant others

28:00

Wes talks about working out and going on date nights with his wife
Hamilton is cool
Home Renos

35:00

Doing a downtown job
Problem Solving

40:00

Scott talks about his love for KungFu Movies
5 Fingers of death
5 Deadly Venoms
secret service of the imperial court
Boxer from shantung
36th Chamber of Shaolin
Human Lanterns

46:00

What kind of cars do we drive?

55:00

1:05:00

What are you working on Personally / Mentally?
Habit Tracker
Doing a downtown job

Quuuuuiiiiiick SIIIIIIICK PICKS

Dan Carlin's Hardcore History: Addendum
Scott: Whatever You Think, Think the Opposite
Wes: Tracy Osbourne's Hello Web Design

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

Snack Pack — CSS Frameworks, React HOC, Render Props, Coding Designers, Early Career Advice and a sound board! Jan 31, 2018

Show notes

Dev Lifts - Sponsor

Dev Lifts - Thad and JC are on a mission to make web developers healthy. Get a Personal Training and Nutrition Plan — use the code SYNTAX for $75 off. They have also just announced their slack-only memberships for $5/month

Freshbooks - Sponsor

If you are a small business or freelancer check out Freshbooks.com Cloud Accountingand get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section.

Show Notes

01:10

you should try out the new Syntax Soundboard by Andre Madarang
Have a Question?! Submit it here!

03:00

Skateboarding on a TRAMPOLINE?!

04:30

Q: What are your favourite features coming to HTML 5.2
Dialog Box
Multiple Main Tags
Thanks Jordan!

10:00

Q: How do you retain all the info you learn like a sponge?
Thanks Ozan

13:30

What are your favourite CSS Libraries / Frameworks?
Thanks Blake!

21:00

What were some of the struggles you had early on in your career? How did you overcome them?
Learning how to read error logs and messages
Dealing with Impatience
Coding is very frustrating

26:50

What are High Order Components and Render Props?
High Order Components
React Render Props
Video: Michael Jackson - Never Write Another HoC
React Downshift
React Reconciliation

34:45

Q: When should you just drop the towel on code?
When should you throw in the towel on code?
Scrapping a codebase and moving from PHP to JS
Let's talk about if it's worth it

41:00

Q: What is the best way for a JS beginner to get their hands dirty?
Don't work on apps, work on pieces!

47:50

How do you recommend a designer falling in love with frontend dev sharpen their skills while being (happily) committed to a full time design position?
Should designers code?

SIIIIIIICK PICKS

Scott: It’s Not How Good You Are, It’s How Good You Want to Be
Scott: Whatever You Think, Think the Opposite
Wes: Tony Robins Podcast
Wes: The Kevin Rose Show

Shameless Plugs

Scott: New React Native Course!
Wes: CSS Grid Course

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

Hosting & Servers — Heroku, Now, Galaxy, Digital Ocean, Linode, Docker, Netlify and more! Jan 24, 2018

Show notes

Xojo — Sponsor

Xojo is a cross-platform development tool for creating native apps for desktop, mobile, web and Raspberry Pi.

With Xojo you really can write just one version of your app, say, on the Mac, click a button, and have a completely native Windows version too.

Xojo lets you abstract yourself from specific platform details, so you can focus on what makes your app unique. All apps have completely native controls, even if they weren’t developed on that platform. Just use drag and drop to create your user interface, and one language to program the functionality.

Users also include Fortune 500 companies, citizen developers, professional developers, IT, hobbyists and students - anyone who wants to build apps faster.

Listeners of this show get 20% off with the coupon code SYNTAX over at xojo.com/syntax

Show Notes

Take a drink every time Wes says exactly

01:10

CSS Grid course is out!

03:50

The most basic hosting / services
WordPress.org, Medium, Wix, Squarespace

05:00

Your Cheap PHP/Apache Hosts
Endurance International Group owns most of the cheap web hosting world
cPanel
Bluehost doing shady stuff
Siteground seems p good

13:20

Service Based Hosting
Heroku
Zeit's Now
Galaxy

15:00

What does "spinning down" mean?
Deploying to these services

17:20

How these services do instant cut-overs to new servers
SSL Certificates

20:00

You should listen to the Our Stacks Explained episode.
Zeit's Now Alias
mLab MongoDB Hosting
Compose MongoDB Hosting

29:00

Raw Server Space
Linode
Digital Ocean
Rackspace
Digital Ocean Droplets
Digital Ocean's docs are 👌👌👌👌

32:00

38:20

Docker

40:00

SPA Apps - React, Angular, Vue...
How to handle Routing
Netlify

SICK PICKS

Wes: Magnetic Magsafe-life USB cable for micro USB, USB-c and Lightning
Wes: Magsafe-like USB that can handle a 87w Macbook Pro
Wow: MONGOOSE VS SNAKE VIDEO
Scott: Bulk Supplements

Shameless Plugs

Scott: Levelup Tutorials Pro
Wes: CSS Grid Course

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

Related Podcasts