DiscoverSyntax - Tasty Web Development Treats
Syntax - Tasty Web Development Treats

Syntax - Tasty Web Development Treats

Author: Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Subscribed: 5,405Played: 78,896
Share

Description

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.
110 Episodes
Reverse
Hasty Treat - CSS Grid Level 2 aka Subgrid
In this Hasty Treat, Scott and Wes talk about CSS Grid Level 2 - aka subgrid. 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 3:27 - CSS Grid Level 2 and subgrid CSS subgrid will allow you to place grid-items’ children along the same lines at the parent grid 5:40 - How it works - Why do we need it? What problem do we have right now? Create your grid as normal - you can create columns, rows, named lines, etc. Your grid-item will also be display grid - this is nothing new - just regular nesting of grid The magic comes in when you want to define the rows and or columns of the sub-item. You can inherit the parent item’s grid-rows / columns by simply saying display: subgrid 11:19 - Browser support It’s about a year out Links Sentry is hiring Grid Level 2 and Subgrid by Rachel Andrew Css Grid Level 2 specs CSS Grid Level 2: Here Comes Subgrid 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 - Where to start with JS × Freelancing × Cron jobs × Split testing × Frameworks in 2019 × More
It’s another potluck episode in which Wes and Scott answer your questions! This month - thoughts on frameworks for 2019, React Native, when should you start freelancing, where to start with JS, cron jobs, split testing and more! DevLifts — Sponsor DevLifts - Thad and JC are on a mission to make web developers healthy. They’re currently offering two options: The first is Fit.Start - perfect for beginners or those looking to get back at it. Use the coupon code “syntax” to get 50% off the fit.start plan. The second is DevLifts Premium - for those looking for a laser-focused approach and maximum accountability. Use the coupon code “tasty” to get 50% off the premium plan. Check it out today! Just for January their eight-week plan is back. Use the coupon code “newyear19” to get $50 off. 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. Show Notes 1:40 Where is the best place to start with JS coming from WordPress? 5:36 How do you set up cron jobs? What are the best tools to use, should they run on their own server or on the application server, etc.? 17:13 What new skills, frameworks, projects are you look forward to learning in 2019? 21:35 Do you use any software for tracking analytics on your site and do you ever use this data to run split tests? If so, what is your preferred method for running split tests? 28:24 What’s your best tip for young coders to stay productive and not lose time? 32:08 I’m 17 and learning web dev. I’m pretty concerned about my skills and feeling some impostor syndrome. Is it ok to start freelancing? 37:26 What is React Native? How do people tend to use it? If you want a native and web app, do they share code? Links WordPress Gatsby Javascript30 Dead Man’s Snitch Corntab Syntax106: A Look Forward to 2019 Drip Segment.io Hotjar ××× SIIIIICK ××× PIIIICKS ××× Scott: Tiding Up on Netflix Wes 1: Capital Gaines by Chip Gaines Shameless Plugs Scott’s Level 1 Styled Components Course Wes’ Courses 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
A Look Forward to 2019
In this episode Wes and Scott take a look back at 2018 as well as a look forward to what’s coming in 2019. 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”. CSS In Depth and In Motion - Sponsor Electron in Action from Manning Publications guides you, step-by-step, as you learn to build cross-platform desktop applications that run on Windows, OSX, and Linux. As a Syntax listener, you can get 40% off all their books and courses by visiting deals.manning.com/webdev and using the coupon code syntax40 at checkout. Show Notes 3:00 - What was hot in 2018? Tooling got easier GraphQL got easier and more accessible New GraphQL companies left and right CSS has gotten more awesome React Improvement in React Dev Tools JavaScript frameworks overall Edge adopting Chrome engine Microsoft bought Github Vue continues to impress and evolve VS Code continued to get amazing 31:29 - Predictions for 2019 Headless CMS game is going to get really real We’re gonna see rails for JavaScript start making some noise React will continue to see growth Design tools will get more code-y (Figma, etc.) VueJS will continue to see growth Developer Experience Tools will continue to get easier Wasm Code splitting easier ES6 Modules in Node Server Side Hot reloading 41:00 - Scott’s Year in Review Released 12 courses Major growth in Level Up as a platform Hired first employees to work and grow site Greatly improved quality and video production Gave first conf talks and spoke internationally 44:03 - Wes’ Year in Review Released two courses - CSS Grid and Advanced React Started work on JavaScript course Delegated lots of development to contractor Continued to work well with assistant Spoke at lots of confs Live Syntax! Grew Instagram Continued hot tips on twitter 47:00 - BIG ANNOUNCEMENT We’re both having babies! 48:09 - Wes’ Goals for 2019 Keep doing what I’m doing! New Website! JavaScript course Platform upgrades - been in the works for months - working on a faster rollout CSS course? VS Code course? More React? 8 YouTube Videos Instagram to 30k Parental Leave 52:26 - Scott’s Goals for 2019 Courses First non-Scott LUT courses (big plans / announcements here ) Parental Leave Major platform updates that are stuck in bottleneck More hires, more growth More free content More teaching from real world code Codebase to Hooks & Suspense Links Next.js Gatsby Parcel Hasura Prisma TakeShape GraphCMS Contentful WPGraphQL Apollo Github VS Code Microsoft Edge WordPress Svelte Vue.js Syntax 067: Goal Setting ××× SIIIIICK ××× PIIIICKS ××× Scott: Fake or Fortune? Wes: Heavyweight Shameless Plugs Scott’s new course on design systems Wes’ Courses 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

A Look Forward to 2019

2019-01-0201:00:064

CSS Layout
In this episode Wes and Scott are talking all about CSS layout - how it works, things to watch out for and more! 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”. CSS In Depth and In Motion - Sponsor CSS in Depth in Motion from Manning Publications is a great way to master CSS. Modern CSS can handle a dizzying array of styles and effects without external frameworks, and this liveVideo course from Manning Publications will get you there. As a Syntax listener, you can get 40% off all their books and courses by visiting deals.manning.com/webdev and using the coupon code syntax40 at checkout. Show Notes 4:15 When to use position fixed/static/absolute/relative/sticky 15:18 When to use height, width, max-height, max-width, top, bottom, left, right, etc. 21:28 What about relationships between containers and their children? 27:37 What about positioning behaviors of elements like , , , etc.? 30:09 Floating and clearing 35:55 Flexbox, Grid and responsive design 36:58 Mobile-first or desktop-first? 41:20 Viewport units - vw, vh, vmin, vmax, etc Links Keycode.info ××× SIIIIICK ××× PIIIICKS ××× Scott: Last Seen Podcast Wes: Flying a DJI Tello Drone with React and Node.js Shameless Plugs Scott’s Design Systems Course Wes’ Courses 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

CSS Layout

2018-12-2600:53:366

Potluck - Typescript × E-commerce platforms × Job-hopping × Working for agencies × More
It’s another potluck episode in which Wes and Scott answer your questions! This month - thoughts on Typescript, e-commerce platforms vs custom, working for agencies, job-hopping 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. Vue.js In Action - Sponsor Vue.js in Action from Manning Publications is a great way to learn Vue.js. If you’re looking for a book that will teach you Vue.js from start to finish, this is the one. As a Syntax listener, you can get 40% off all their books and courses by visiting deals.manning.com/webdev and using the coupon code syntax40 at checkout. Show Notes 1:20 How do you distinguish between normal and virtual pixels on high dpi devices. How do you call Pixels? Which tools do you use for optimizing Images? 5:02 What are your thoughts on TypeScript (and selfishly, I’d like to learn about using it with React)? Any temptation to try it out if you’re not already doing so? Why or why not? Any resources you’d like to share on TypeScript? 8:35 I have heard you guys say good things about Digital Ocean before, but am reading a lot of bad reviews about them on various websites. Are these just frustrated developers or is there any merit to these claims? 12:48 If you were to build an eCommerce store, given that your business requirements specify that custom functionality is needed, would it be smart to roll your own solution or use Magento/Shopify/Woocommerce? If the later, what is the developer experience like? Which has the greater ability to implement custom functionality for server and client side code? 19:50 I feel like I’m pretty “bos” at starting projects but so terrible at finishing them. As people who finish courses and projects all the time, what is your advice for getting to that finish line? 23:32 Could you please explain how you organize your files? What is the folder structure you use for both your projects and other documents/videos and stuff? 31:38 You guys mention working for “agencies” in the past. As a freelance web developer, what’s the best way to find these agencies, and to be employed by them? Also, can you explain what “agencies” are? 38:14 I once read an interview Wes gave in which he mentioned that frequently changing jobs is the best way to get salary increases. Do you both believe that to be true? Is job-hopping a bad thing? Is the criticism of it justified? 41:53 If I choose to use Next.js, does that mean I won’t be able to use new React features like hooks and suspense until/if the Next.js team implements those? 43:12 When do you use  and when do you use  to wrap your many returned components from render()? Links Devon Govett tweet about Typescript Digital Ocean Magento Shopify WooCommerce Reaction Commerce Snipcart Next.js Gatsby.js True Grit Texture Supply ××× SIIIIICK ××× PIIIICKS ××× Scott: Undertale Wes: Ghostly Pixels Shameless Plugs Scott’s Level Up Pro Wes’ YouTube Channel 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
Not a Clip Show - Episode 100!
To celebrate episode 100, Wes and Scott are talking about Syntax - their most popular episodes, stats, Q&A, and a bunch of cool stuff about what it’s been like making this show for 100 episodes. 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”. 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 1:45 - Celebrating 100 episodes 04:18 - Our first episode Syntax001 - React Tools 06:23 - Our first sponsor Delicious Brains 09:37 - Most popular episodes 10 - Syntax074 - 11 Habits of Highly Effective Developers 09 - Syntax039 - Is jQuery Dead? 08 - Syntax046 - What’s New in Javascript 07 - Syntax048 - VS Code Round Two 06 - Syntax050 - Progressive Web Apps 05 - Syntax018 - All About CSS Grid 04 - Syntax051 - Our Workflows: Design, Development, Git, Deployment 03 - Syntax066 - The React Episode 02 - Syntax043 - 20 JavaScript Array and Object Methods to make you a better developer 01 - Syntax044 - How to Learn New Things Quickly 21:35 - Top countries Just passed 3 million downloads 10 - Poland - 38,731 downloads 09 - Brazil - 40,475 downloads 08 - Netherlands - 47,601 downloads 07 - India - 50,724 downloads 06 - Sweden - 55,378 downloads 05 - Australia - 80,654 downloads 04 - Germany - 109,842 downloads 03 - Canada - 138,250 downloads 02 - United Kingdom - 231,835 downloads 01 - United States - 1,220,519 downloads 27:34 - Top players AppleCoreMedia Overcast Chrome Pocket Casts iTunes 30:35 - Lessons learned about sponsors Pays the bills - editing, hosting, etc… Podcast Royale - Podcast production Libsyn - Podcast hosting They want hard numbers Conversions are hard to track It’s really cool companies and users that enjoy the product hook up How do we get them? 35:10 - Favorite episodes Wes - Syntax043 - 20 JavaScript Array and Object Methods to make you a better developer Scott - Syntax044 - How to Learn New Things Quickly 38:49 - Q&A Q: What’s your favorite soundboard sound? Q: What’s your recording process like? Do you each record your streams locally then edit them together or are there any “hax” you guys have cooked up as developers? A: Pay someone who is good at editing We both have good recording gear We record separate files and send them our production team, Podcast Royale, for editing We do show notes in Dropbox Paper, which are also edited by Podcast Royale Q: Does Scott practice his segues, or do they just come to him on the fly? A: On the fly 😎 Q: Although I am all for peace, why did you choose “peace” as your outro statement? A: It was a random note from Wes in the first episode and we stuck with it Q: how did you meet each other and decided to start the podcast? A: We both released a course around the same time with the same name - we started talking and the rest is history Syntax007 - Scott Tolinski Origin Story Syntax008 - Wes Bos Origin Story 51:20 - Most asked questions What episode was it that you ______ ? Can my boss come on the show and talk about bitcoin? Can you sick pick my thing? Can you do an episode on VueJS? Can you do an episode on Angular? NO EP TODAY? 54:20 - Random thoughts Neat to have community - lots of experts Twitter is great Sales of our own products Transformed Level Up Tuts Doing fitness, hobbies, and life as a developer is fun Learned a lot from researching shows and from community feedback Different voices can give different breakthroughs 57:10 - Future of Syntax No. 1 goal is to always be a fun, helpful show Not going to become a promotional tour stop Maybe more interviews Easy to listen to and and understand Links Netlify Podcast Royale Libsyn Dropbox Paper Studio 3T ××× SIIIIICK ××× PIIIICKS ××× Wes: MongoDB Compass Scott: Notion Shameless Plugs Scott - Level Up Pro Wes - All courses 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
loading
Comments (21)

Peter Cruckshank

Talk abouta great episode 😎👐👐 Over 100 episodes and they've still got it!

Dec 27th
Reply

Peter Cruckshank

Congrats on 100 episodes of the best podcast out there!!!

Dec 24th
Reply

Peter Cruckshank

I sure love me some Hasty Treats 😎🍻👐👐

Dec 17th
Reply

Aji Prasetyo

Good podcast for listening

Dec 4th
Reply

souvik88

thank you

Oct 14th
Reply

afflexux

Never miss one. Great stuff fellas.

Sep 28th
Reply

Момчил Цеков

Amaizing podcast!!!!

Sep 22nd
Reply

Ashwin Saxena

Don't know if creators, Wes or Scott is reading this, but one question they asked in podcast is which password manager listener is using: my answer is LastPass. Nothing came close to it.

Sep 19th
Reply

Salman Qureshi

I wish this podcast never dies! never stops

Sep 6th
Reply

Sai Besabella

I always listen to this podcast going to work and going home

Sep 4th
Reply

Dave Epps

couldn't have timed this one any better - just finished this module and they didn't let us use redux. need an instant refresh. thx! @GA-wdi-Den

Aug 15th
Reply

Philly Stafford

I just discovered these podcasts today. They're awesome! Thanks for putting in the effort to make them

Jun 10th
Reply

Mike Fio

Thanks for the great info. You tea guys are great.

May 16th
Reply

Eddy Vinck

This is a fantastic podcast. I like listening to it when I'm on public transport or in the gym.

Apr 28th
Reply

Susheel ML

this is an awesome podcast! keep it going

Apr 13th
Reply

Joe Previte

This is my favorite podcast on web development!

Mar 11th
Reply

Zubair Ahmed

Pretty awesome podcast!

Dec 25th
Reply

Pavel Rodriguez

As an aspiring web developer I find listening to these 2 pretty informative. I'll be learning about something,then I will hear them talk about it. it's pretty awesome

Nov 22nd
Reply

Anthony Ramirez

this Podcast Rocks!

Nov 20th
Reply

白小霁

不错

Aug 18th
Reply
loading
Download from Google Play
Download from App Store