All About CSS Grid

In this Hasty Treat, Scott and Wes talk about libraries that have been super hot in the past, but not so much any more. Contentful - Sponsor Contentful is a great way to manage your data. Update once and publish everywhere. Contentful gives you a ton of flexibility and reliability and everything you need to build excellent front-end content without having to worry about the back-end of your site. Check out contentful.com/syntax and get a free pair of socks! Show Notes 4:14 Grunt / Gulp 8:56 Backbone / Marionette 13:00 Bower / Components 15:46 Compass Links Grunt Gulp Backbone Marionette Bower Components Compass 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

17 Joulu 201822min

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

12 Joulu 20181h 7min

In this Hasty Treat, Scott and Wes talk about the costs of running a business when you’re a solopreneur or solo founder. Contentful - Sponsor Contentful is a great way to manage your data. Update once and publish everywhere. Contentful gives you a ton of flexibility and reliability and everything you need to build excellent front-end content without having to worry about the back-end of your site. Check out contentful.com/syntax and get a free pair of socks! Show Notes 3:48 - Email GSuite Missive Drip Postmark Mailchimp Mandrill SendGrid Mailgun 10:44 - Transactional Costs Stripe PayPal Braintree 12:31 - Software Sketch Figma Screenflow iShowU DaVinci Notion Todoist Things Principle For Mac Textexpander Transmit Cyberduck 17:03 - Services PO Box 17:18 - Domains Hover Cloudflare Name.com Gandi 19:30 - Backup NAS Dropbox Backblaze S3 22:12 - Labor Assistant Part-time developer Contractors for projects 24:53 - Insurance Prescriptions Dental Optical Critical illness Home insurance is higher because of business 26:51 - Professional Accountant Lawyer Bookkeeper TransferWise 29:08 - Hosting CDNs Galaxy Heroku Dokku Netlify Compose Vimeo Amazon S3 Digital Ocean Now.sh Bluehost mlab 34:16 - Travel Taxi / Hotel Dinner Transportation Uber Links Codepen Radio - Software We Pay For 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 Joulu 201836min

In this episode Wes and Scott are joined by their first ever guest on the show: Sacha Greif. Sacha is one of the makers of the State of Javascript - the topic for today’s show. Wes, Scott and Sacha discuss the results of 2018’s survey, what they think, and implications for the industry. 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:48 What is the State of JS survey 3:58 The tech behind State of JS 12:55 How was the data collected? 16:38 JavaScript Flavors 23:14 Frameworks 31:49 DataLayer 34:53 Backend 40:09 Other Tools 44:37 Opinions 47:48 Awards 49:58 Criticism Links Nivo Gatsby Netlify Reason Parcel Relay Express KeystoneJS Ghost Jest GraphQL VueX Storybook Real Analysis of Angular, React, and Vue ××× SIIIIICK ××× PIIIICKS ××× Sacha: DIY and woodworking Wes: Alex French Guy Cooking Scott: Silverback Open 2018 Shameless Plugs Sacha - Vulcan.js 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

5 Joulu 20181h 2min

In this Hasty Treat, Scott and Wes talk about CSS variables, a.k.a CSS Custom Properties - why you might want to use them, why they’re better than various preprocessor’s variables, and pitfalls to watch out for and avoid. 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 3:25 - What --example-name, represent custom properties called using var() Overwrite with a more specific style Use JavaScript to append .style.setPropert( How are they scoped? Just like normal CSS Can be set on :root {} Can be set on any element down 9:10 - Why Uses: Can make more sense if used semantically var(–accent) vs var(–yellow) Independent values for things that can’t be broken up: box-shadow: 2px 2px 2px 2px red transform: rotate(var(–rotate)) scale(2); Inline properties can be picked up by regular CSS (color, size, etc.) hey Themes that can easily be changed at runtime for entire app 19:15 - Calculations You can use them inside of calc() Animations 20:10 - Bummers Not super well supported just yet (IE 11) No good fallback other than manual fallback Syntax - Old Browsers, Fallbacks and Polyfills series Part 1 Part 2 Part 3 PostCSS Custom Properties 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

3 Joulu 201825min

In this episode Wes and Scott bring you their holiday gift guide - things, ideas or experiences that would make great gifts for any developer, ranging from a few bucks to a few hundred bucks. Contentful - Sponsor Contentful is a great way to manage your data. Update once and publish everywhere. Contentful gives you a ton of flexibility and reliability and everything you need to build excellent front-end content without having to worry about the back-end of your site. Check out contentful.com/syntaxfm and get a free pair of socks! 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:57 - Foodie Gifts Hot Sauce Merfs Every Cholula Hot Sauce Jalapeno from Trader Joes Blue Top Creamy Buffalo Everything but the bagel Spice Loose leaf Teas from Teahaus.com Wes’ Tea Steeper Scott’s Tea Mug & Steeper Flavored Salts (No link, just go find them) Savory Spice Shop Rainbeers - make it yourself Beer Making Kit Umai Dry Steak Aging and Charcuterie Bags 11:27 - Experiences Knife Skills Class Butchering Class Cooking Class Float tank Subscription Massages 18:15 - Subscriptions Headspace Spotify HBO Go YouTube TV MeUndies Underwear Subscription Memrise LastPass Magazines Mantry Crates Kids Crates 23:07 - Books / Audible BadBlood Beat the bank - for Canadians Only American Kingpin Rich Dad / Poor Dad Kingpin: How One Hacker Took Over the Billion-Dollar Cybercrime Underground Anything You Want Essentialism The E-Myth Revisited 29:47 - Clothes Uniqlo Jeans - w/ elastic Carhart Beanie (TOQUE) Naked and Famous Raw Selvedge Denim Jeans Skinny Guy Weird Guy Nudie Raw Selvedge Denim “thin Finn” “Unbranded” Raw Denim Custom Leather Belt TNF Fanorak Windbreaker Hoodies Adidas Black-on-black NMD crewneck Champion Hoodie Sneakers Nike Airmax 270 Jordans DonTrip RayBans with mirrors Original Wayfarer Sunglasses Under Armour Boxer Jock Underwear Reebok Boxer Brief Underwear dvlpr.io Merch 39:08 - Gadgets Mechanical Keyboards CTRL Keyboard WASD Keyboard Code Keyboard Ergodox 10W qi Wireless Fast Charger Charging Pad USB C Gadgets 8-in-1 USB Type-C Hub with HDMI USB C Hub LaCie Rugged USB-C Hard Drive Koomus Car CD Slot Magnet Mount for your phone Anker Portable Battery Extra Long Braided Phone Cables Lighting Micro USB USB-c Anker USB Power Block 4 ports with Fast Charge 6 ports with Fast Charge Wifi Hotspot SkyRoam Solis Magnet Breakway USB-C Cable that handles 87w Tello Programable drone High end mini screwdrivers MaxCraft 7-in-1 iFixIt 64 bit set 48:00 - Smart Home Google Home Ring Doorbel Nest Doorbell Ring Floodlight Security Camera EcoBee WeMo Plugs TP Link Smart Plug Leviton Smart Wifi Dimmers LIFX Bulbs Sonoff $5 wifi Switch 54:40 - Grooming and Wellness Seki clippers CBD balm A nice comb Burts Bees Lip Balm in a tin 58:57 - High End Apple AirPods Bose QC 35 Wireless Headphones Samsung QLED TV - very high end Shameless Plugs Scott’s Level 1 Typescript Course Wes’ updated course platform 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

28 Marras 20181h 5min

In this Hasty Treat, Scott and Wes talk about installing dependencies vs rolling your own - the advantages and disadvantages, and how to know when to do either. 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 replayer and a performance monitor. Get 14 days free over at https://logrocket.com/syntax. Show Notes 2:15 - Reasons To roll your own Learning Experience Fun Features Add your own features Lightweight - only use what you need 8:08 - Reasons not to roll your own Battle Tested Actually Tested Time Money Experience 11:27 - Fork Something needs extra features Upstream your changes 13:10 - Some Examples Fetch + function vs Axios Date functions vs Stack Overflow copy/paste Lodash vs your own - try it with map/reduce/filter first, but lots of cases need Lodash Links React PowerPlug Lodash Axios Stack Overflow 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

26 Marras 201819min

It’s another potluck episode in which Wes and Scott answer your questions! This month - raising your rates, full stack designers, JWT, VS Code tips, 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. React in Action - Sponsor React in Action by Mark Thomas from Manning Publications is a great way to learn React. It’s a clearly written, example-rich book, introducing front-end developers to the React framework and related tools. Not everyone likes learning from a video. If that’s you, React In Action is a great book that covers everything you need to know. Also be sure to check out this page for 40% off all manning books and videos. Show Notes 2:29 I listened to your episode on Freelancing and I was wondering how to justify an increase in my hourly rate. You mentioned that you just increased it to $100/hr and nobody griped, but I seem to have a steady stream of clients who want things for free or nearly free and I usually have that fear that if I charge them more, then I won’t get the business. Thoughts? 6:55 I’ve started a YouTube web development channel. Recently, I was approached to produce content for money for another website. For some reason, I immediately thought I might be taken advantage of (I’m pretty new and it’s odd to be offered something like this so quickly, no?) if accepting. What do you think? Should I create content for a (small) website that I never heard of or continue with YouTube (or both)? 14:00 I’ve read on Twitter that React.Context can be a good replacement for Redux. Why? 18:40 What’s it like running a podcast?! 24:03 I’ve seen a rise in the term “full-stack designer”. Is this a title you think will become a real thing? Someone capable of overseeing a project from concept to prototype? Thanks! 27:36 What has been the most awkward situation you’ve been in as a dev? 31:20 Do you have any good resources on JWT? I’m unclear when my front end needs to send what to my back end, to ensure my sites and only my sites can get the data requested from my server. Thanks for everything you do! 35:34 How do you move selected text horizontally (or vertically) in VSCode? I’ve seen it in Wes’ videos and I tried to ask him on Twitter, but I’m sure that is a chore to keep up with. I’ve googled a ton, but the only thing I found was an extension that adjusts indentation, which is not really what I’m after. 38:57 How do you recommend providing feedback on “bad” code to a developer more experienced than you, without coming off as an uppity, know-it-all junior who just read a bunch of textbooks?? 42:39 How do you set up an IP whitelist? I am just getting started managing databases and I am using Mongo Atlas. They require an IP whitelist for all connections. Developing from my computer is fine because I can just add my IP to the whitelist, but what do I do if I actually want to make my API or website public? Just whitelist everything? That sounds like a terrible idea… Links useReducer Full Stack Radio Ep 98: Ryan Chenkie - Securing Single Page Applications ××× SIIIIICK ××× PIIIICKS ××× Scott: Jelle’s Marble Runs Wes 1: Good Quality Baking Sheet Pans Wes 2: Pre-cut Parchment Paper Sheets Shameless Plugs Scott’s Pro Gatsby 2 Course Wes’ Advanced React Course - use the 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

21 Marras 201852min