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:

Design Tips for Developers Aug 22, 2018

Show notes

In this episode Wes and Scott dive into designing for developers - tips and tricks for improving your designs, and how to up your game in small ways that will have a big impact on your projects.

Sanity.io - Sponsor

Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get up and running by typing npm i -g @sanity/cli && sanity init in your command line. Get an awesome supercharged free developer plan on sanity.io/syntax.

Mlab - Sponsor

mLab is the leading Database-as-a-Service for MongoDB, powering over half a million deployments worldwide. Wes and Scott use mLab to host their own databases as well as take care of backups, security, scaling and performance. Try out a sandbox database on your next mongoDB project → https://mlab.com.

Show Notes

6:18 - General Design Tips

Spacing is important
Using patterns and textures
Use subtle gradients
- ColorSpace
Use subtle drop shadows
- Multiple shadows on one element can have a nice effect
Don’t use true black and white (e.g. #000 or #fff) - use softer variation of black and white
- Use CSS Variables for custom blacks and whites
- CSS default colors are almost always too harsh
Default browser UI is almost never the best UI
- Select elements, radio buttons, checkboxes, etc. can all be styled - it’s no fun, but way better than it’s ever been

40:22 - UX Design & Animation

Don’t use animations when not necessary
Subtle scale/transitions on hover can be a nice effect
Particles.js
Patagonia’s Bears Ears
CSS transitions vs Physics based

51:30 - How To Get Better

Follow UI-themed Instagram accounts
siteInspire
Dribbble
UISources
Follow Steve Schoger
Find a free mockup and build it out pixel for pixel
Take time to challenge what you think is possible or doable technically and creatively

××× SIIIIICK ××× PIIIICKS ×××

Scott: Louis Cole
Wes: r/posthardcore Spotify Playlist

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

Hasty Treat - Goal Setting Aug 20, 2018

Show notes

In this Hasty Treat, Scott and Wes talk goal setting - why it’s important, when to do it, how to stick to them, and more. Tweet us your goals with the hashtag #syntaxgoals.

Sentry - Sponsor

If you want to know what’s happening with your errors, track them with Sentry. Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting Sentry.io and using the coupon code “tastytreat”.

Show Notes

4:14

Setting SMART goals (Specific, Measurable, Attainable, Relevant, Time)

7:45

What kinds of thing should you set goals for?

10:49

Business goals

16:50

Visualizing Goals

22:58

When should you set goals?

27:42

Accountability

Links

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

The React Episode Aug 15, 2018

Show notes

In this episode Wes and Scott do a deep dive into React - what it is, best practices and all the ins and outs of how the framework works.

Dev Lifts — Sponsor

DevLifts - Thad and JC are on a mission to make web developers healthy. They’re currently offering Personal Training and Nutrition Plans as well as a new program called fit.start(). Get 50% off fit.start() with the coupon code “SYNTAX”. Additionally, the first 10 people to use the code "TASTY" get 50% off your DevLifts Premium subscription. Check it out today!

Mlab - Sponsor

mLab is the leading Database-as-a-Service for MongoDB, powering over half a million deployments worldwide. Wes and Scott use mLab to host their own databases as well as take care of backups, security, scaling and performance. Try out a sandbox database on your next mongoDB project → https://mlab.com

Show Notes

5:23

Components

12:30

JSX

25:13

Data and Props

44:48

Fetching

49:22

Event Handlers

54:00

Instance classes + properties

55:02

Lifecycle Methods

59:55

Context

1:01:35

Routing

Links

Preact Inferno How to Comment in JSX (article) Apollo Redux LevelUpTutorials.com Level II React Course React Informed (forms) Meteor Axios Firebase Gatsby Here’s how React’s new Context API works

××× SIIIIICK ××× PIIIICKS ×××

Scott: Dark Net Diaries Podcast
Wes: Any suggestions for key management products? + Iliza Shlesigner Stand-Up

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

Hasty Treat - Building Curriculum for Courses Aug 13, 2018

Show notes

In this Hasty Treat, Scott and Wes discuss how they create courses, design and build curriculum, as well as insights and best practices for content creation.

Sentry - Sponsor

If you want to know what’s happening with your errors, track them with Sentry. Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting Sentry.io and using the coupon code “tastytreat”.

Show Notes

4:32 - Wes’ process

Figure out what to make
Build the thing you’re teaching in the course
Have it reviewed by experts
Simplify and create a linear flow for what you’re teaching

16:25 - Scott’s process

Chose a topic
Build the thing
Create the outline as you go
Have goals in mind, for individual topics
Record with final code open

28:25 - How to get started

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 Office Setups (Gotta Get The Gear) Aug 08, 2018

Show notes

Scott and Wes talk office setups and all things gear. Gotta get the gear!

Mlab - Sponsor

mLab is the leading Database-as-a-Service for MongoDB, powering over half a million deployments worldwide. Wes and Scott use mLab to host their own databases as well as take care of backups, security, scaling and performance. Try out a sandbox database on your next mongoDB project → https://mlab.com

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.

Show Notes

11:00

13:30 - Computer

Wes: Macbook Pro 15"
Scott: Macbook Pro 15"

17:39 - Monitors

Wes:
- [22" vertical Cheap Acer: https://amzn.to/2vkXomG
- [27" Dell 4k - https://amzn.to/2Mo3NnO
- [Ergotron Monitor Arms - https://amzn.to/2voS9CF
Scott:
- LG 34UC88-B 34-Inch 21:9 Curved UltraWide
- VIVO Dual stand

28:33 - Keyboards and Mice

Twitter Thread about mice
Wes:
Scott:
- CODE Keyboard
- Apple Magic Trackpad

33:14 - Desks

Wes:
- Ikea Countertop
- Ikea Alex Drawers
Scott:
- Ikea Karlby Walnut Countertop + Jarvis Legs === dope desk!

37:53 - Chairs

Wes:
- Herman Miller Aeron Polished Aluminum
Scott:
- Herman Miller Aeron

39:24 - Headphones

Wes:
- Bose QC35s
- Apple AirPods
Scott:
- AKG K 553 Pro
- M-Audio Bx8 monitors
- Polk Audio 12” Subwoofer for that booom booom!

43:50 - Hard Drives / Backup Systems

Wes:
- WD My Passport 1TB
- Backblaze Backup
Scott:
- WDMyCloud EX4100

47:28 - Charging Stations

Wes:
- Anker USB Wall Charger

48:52 - USB Splitters

Wes:
- CalDigit TS3 Plus
- Amazon Basics USB 3 Hub
Scott:
- CalDigit TS3 Plus

50:35 - Wifi

Wes:
- Amplifi HD Mesh
Scott:
- Google Wifi Mesh

54:26 - Recording Gear

Check out episode 037 for a full rundown of all of our recording gear
Wes:
Scott:

58:32 - Misc

Wes:
- Peak Design Everyday 30L Backpack
- Skyroam Solis Hotspot
Scott:
- Google Home
- Smart outlet that shuts off all my stuff
- topodesigns.com

Links

Laravel Nova

××× SIIIIICK ××× PIIIICKS ×××

All of the above ;)

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

Hasty Treat - JSON, JSONP and CORS Aug 06, 2018

Show notes

In this Hasty Treat, Scott and Wes discuss all things cross-origin - APIs, Javascript, JSON, CORS, and more.

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.

Show Notes

3:52

What is JSON?

5:09

Origin policy in the browser

6:00

Cookies + how they work

6:38

How do you get data from one site to another?

7:00

JSON P (JSON with Padding)

9:00

CORS (cross-origin resource sharing)
CORS errors + learning on the fly

11:31

Canvas elements

12:24

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 - Editor Fonts × Portfolios × Meetup Tips × Switching to Windows × Freelancing Sources Aug 01, 2018

Show notes

It’s another potluck episode in which Wes and Scott answer your questions about freelancing, portfolios, code editors, meetup tips, switching to windows and more!

VueSchool.io's Vue.js Masterclass — Sponsor

Check out VueSchool.io’s new Vue.js Masterclass taught by Alex Kyriakidis. Learn Vue.js along with best practices, modern Javascript, and other exciting technologies, by building a real-world application - a forum. The first 50 people to visit VueSchool.io/syntax to get 25% off.

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.

Show Notes

2:37

Question: Maaz Syed Adeeb - Are editor fonts worth the investment (if yes, why)? Why are they such a big deal in the first place?
Operator Mono
Dank Mono
Fira Code

6:10

Question: Ste O’Neill - How can I come up with ideas for projects? What can I put in a portfolio when I work for an agency?

9:10

Question: JavaScript Joe - If I only have two hours per week to work on coding projects, do I spend it building a side project or do I spend it contributing to open source? What’s your experience contributing to open source?

10:45

Question: Diane - Why is Git so hard to grasp in team projects? What are the best resources to master it?
Try Github

13:35

Question: Grant Chambers - What are some tips for going to your first meetup?
React Meetups

20:23

Question: Michael Hoffman - Have you ever thought about using Linux or Windows as your main operating system?
Google Pixelbook
Microsoft Surface Pro
Figma
Logic
Sketch
Mint OS
Final Cut Pro

27:39

Question: Would you recommend using Upwork for starting out freelancing or something similar?

31:18

Question: Mike C. - What do you guys think about sites like Codewars and Code Fights? Being new to web development, I find the problems hard to solve. Is it important to know how to solve all these problems? If so, how do I get better at developing the mindset to solve them?
JavaScript 30
Level Up Tutorials

38:47

Question: When I work on a website, I need to record user names, passwords, URLs, keys, logins, cPanel, WordPress, ftp, MySQL for each and every website, local and remote. Currently, I use a text file to save all that information. How are you storing all this info? How others do it? How the pros are managing this? Pros and cons?
SSH Key
LastPass
1Password

42:15

Question: Chandler Bing - What happened to Scott’s YouTube channel?

44:57

Question: Whose idea was it to do a podcast? Who approached whom first?
Josh Owens
Egghead.io

××× SIIIIICK ××× PIIIICKS ×××

Scott: Jarvis Legs
Wes: King of the Road

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

Hasty Treat - Whats the deal with npm, yarn and lock files?! Jul 30, 2018

Show notes

In this Hasty Treat, Scott and Wes discuss npm, yarn, lock files, why they’re useful, why you would or wouldn’t want to track them in Git and much more!

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.

Show Notes

4:10

What is npm and yarn?

8:00

What’s the difference between npm and yarn?

12:00

What is semver?

16:40

What is the dependency tree?
This is the problem that lock files solve

20:32

Cool new features of npm and yarn
- npx
- security warnings

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

The Undocumented Web: scraping, private APIs, proxies and “alternative solutions” Jul 25, 2018

Show notes

What is the undocumented web? Scott and Wes dive into it, discussing APIs, faking, scraping, automation, proxies as well as tips and tricks for best practices.

Kyle Prinsloo’s Freelancing & Beyond — Sponsor

Kyle Prinsloo teaches you everything you need to know about freelancing, including how to quit your job, earn a side-income and start taking control of your life. Check it out at https://studywebdevelopment.com/freelancing and use the coupon code “syntax” at checkout to get 25% off.

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.

Show Notes

3:05 - What Is the undocumented web?

When traditional methods don’t give you what you want
Wild West

6:10 - Undocumented APIS

Instagram’s private API
Use dev tools’ XHR Request
React Dev Tools will also have the data
Ep 008 - Wes Bos Origin Story
Realtor.ca - MLS Mapping
Simon Willison’s Zeit Day Talk about XML files
Charles Proxy App - also good for debugging requests

17:34 - Faking

Faking User Agents
- Sending headers from requests
- Free Blackberry wifi on plane

23:52 - Scraping

What is craping?
Cheerio - jQuery like node package

27:30 - Automation

Cron Jobs
Filling out forms instantly
Headless browsers
- Puppeteer
- PhantomJS

33:30 - Proxies

Need a fresh IP address
Need a different country
Side note: Canadians buying stuff in USA M4S1P1 === 41100
API throttling

39:00 - Tips and Tricks

Multiple API keys
diskDB - Text files as databases
Search Github for API keys
Inspect Element and Delete Overlays
Delete Cookiesokay

44:45 - Stories

Photo Voting
MLS Listing
Top Entrepreneur voting cheating
Vanity Plate Checker
My Hockey Team Sucks
Vehicle auction bidding app
youtube-dl

××× SIIIIICK ××× PIIIICKS ×××

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

Hasty Treat - Refactoring Jul 23, 2018

Show notes

In this Hasty Treat, Scott and Wes discuss refactoring, what it is, why you should do it, when to do it, as well as best practices and much more.

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.

Show Notes

5:00 - What is refactoring and why would you do it?

Re-writing code while maintaining functionality
The first code you write is most likely not your best code

7:32 - Benefits To Refactoring

Keep part of your codebase in your head
Keep codebase timely and up to date (E.g. promises, async, await, etc.)
Writing code from the vantage point of having already built your product
Performance improvement

12:54 - When to refactor

When it’s stopping your from progressing
When brining someone new on to your team
When you can see a more elegant solution
When you’re having performance issues
When you’re sharing or presenting code
When you have a large codebase that needs to be broken up into smaller components

19:03 - Tips on how to refactor

Testing will make refactoring easier
Identify bad code and problem areas
Use git as an escape hatch
Break things into smaller chunks
Publish often use code to npm as modules

Links

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