929: Cloudflare Blocks AI Crawlers × Debugging Local Data × Raising Kids with Healthy Digital Habits and More

Wes and Scott talk about the future of CSS - what is new and what should we expect to be coming in the near future? Bug Replay - Sponsor You need to try out Bug Replay for recording and re-playing browser based bugs. It's a bug reporting tool that can be used at all stages of development and by anyone in your organization. Provide your dev team with detailed reports so they can fix bugs faster. 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. The Show Notes! 03:30 IT'S NOT CALLED CSS4 You can find the different levels over at CSS Working Group Drafts 06:24 CSS Custom Properties (CSS Variables) Bite and chew over the syntax - it's backwards compatible What's the difference between this and Sass/Less/Stylus? JavaScript30.com Day 3 uses JavaScript + CSS Variables CSS Tricks: The CSS attr() function got nothin’ on custom properties Independent Transforms - transform: rotateX(var(--x)) translateY(var(--y)); 19:20 CSS Filters Drop Shadow Filter SVG Filters 28:20 RRGGBBAA Hex transparency in colors 31:00 Colour Functions CSS Next Draft Spec for Color Functions 36:00 CSS Level 4 Selectors ITS NOT CSS4!!!!!! css4.rocks 40:00 nth-of-selectoed :nth-child(3n of img.dog) div:has(img) 44:00 Some not-so-new-but-still-cool units Viewport Units min-height: 100vh ch units ex units CSS Angles - deg(), grad(), rad(), turn() Sick Picks Scott: Google Pixel 2 XL Wes: Anker 5 Port 40w USB Charger Anker 10 Port 60w USB Charger Anker 5 Port 60w with a USB-C Port Tweet us your tasty treats! Wes' Twitter Wes' Instagram Wes' Facebook Scott's Twitter Scott's Instagram Make sure to include @SynaxFM in your tweets

29 Marras 201758min

Wes and Scott talk about their fitness journey and how it relates to being a web developer in terms of energy, focus and mental clarity. Get Fit with Dev Lifts — Show Sponsor Dev Lifts - Thad and JC are on a mission to make web developers healthy. They are currently offering Personal Training and Nutrition Plans for $149 (Regular $249) and with the code Syntax you'll get an extra $50 off. That's only $99 for the next ~95 people! The Show Notes 04:20 - Scott's Fitness Story 08:00 - Wes's Fitness Story 09:50 - The benefits of fitness and being a web developer. Productivity / Focus / Mental Clarity 14:00 - Finding Time to Work Out Tweet your work + workout routine to @SyntaxFM 17:40 - How to work out / What to do / Routines? 24:00 - Learning to code && Learning to Workout 25:20 - Significant Other Buy-in Fitness Blender Starting Strength 28:00 - All About Dev Lifts Jeff Nippard Youtube 34:00 — Nurition 36:00 — Wes' Keto Nutrition Plan Dom D'Agostino Keto Interview MyFitnessPal Keto Reddit Keto Gains Reddit 41:00 - Scott's Nutrition 42:00 - Pop or Soda? 45:45 - 16 : 8 Intermittent Fasting IF Reddit 48:30 - Dieting is bad Supplements — Don't take our Advice here. Talk to your trainer. 50:00 - Wes' Supplements and how Bags of Milk are the best BCAA Amino Energy Preworkout Coke'd Up Cissus Quadrangularis Extract - Genoflex Fish Oil Vita Jym Multivitamin 54:00 - Scott's Supplements NOW Adam Superior Men’s Multi Optimum Nutrition Gold Standard 100% Whey Protein NOW Psyllium Husk BulkSupplements Pure L-Citrulline DL-Malate 2:1 Powder Bulksupplements Pure Caffeine Capsules. Caffeine can be dangerous warning! Sick Picks Scott: TriggerPoint GRID Foam Roller Wes: Nike Techfleece Joggers Tweet us your tasty treats! Wes Bos Scott Tolinski Make sure to include @SyntaxFM

22 Marras 20171h 10min

Wes talks to Scott about speaking at conferences. What are the benefits of speaking? How do you apply? What talk should you give? What makes a good conference talk? Freshbooks is the best! Freshbooks.com/syntax - Get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section. The Show Notes Snow Tires are supes important Blizzzzaaaaakkksss!!! Benefits Free travel / accommodations / vacation Fantastic Friendships and Industry Connections Job Opportunities Industry Recognition Renewed Excitement Wes loved David K Piano's Flip Talk How do you Apply / Where to Find Conferences Create a CFP You need to brute force it 🍯 Honey Hole: Lanyrd Calls 🐝 Honey Hole: The Weekly CFP 🍯 Honey Hole: Papercall.io Meetup Types of Talks you could give Lessons Learned Talk The New Concept Talk (the tasty treats talk) My Approach to XYZ The Complicated Concepts Explained The Super Interesting Deep End Talk What makes a good talk? Skip the history lesson - hook them Keep your personal bio short Start with a banger ‼️ Short Code Examples Short Looping video examples Scott's Origin Story Podcast Make sure your talk works offline Prepare for aspect ratios Plug into the projector before your talk Live that dongle life Show people why they need to know something Slide Deck Software Powerpoint or Keynote Wes' HTML5 Slide Deck Another one of Wes' talks Reveal JS React Spectacle Prezi Conference Training Training pays well More hands on experience for conf attendees Getting the Most out of a tech conference Wes' Post on Getting the most out of a conference Conf Code of Conduct Logitech Wireless Clicker Join Twitter Early Have Lunch with Speakers Stay off your phone Keep your name badge on! Practice your break away Sick Picks Scott: Spectacle Window Manager Wes: What the heck is the event loop anyway? Tweet us your tasty treats! Wes Bos Scott Tolinski Make sure to include @SyntaxFM

15 Marras 20171h 7min

It's a long awaited CSS Grid show! How does it work? When do you use it? What's the difference between Grid and Flexbox? Sponsor Save A Bro is selling absolutely hilarious mustache t-shirts for $18 - all proceeds go to support the fight against prostate cancer. Use the coupon code "syntax" at checkout to get free shipping in the US. The Show Notes Wes Bos AMA where he tricked Scott that Bert Bos was his dad CSS Tricks A Complete Guide to Grid Rachel Andrew Rachel Andrew Twitter Rachel's Grid by Example Rachel's Grid AMA CSS Grid Garden The Story of CSS Grid, from Its Creators Jen Simmons Jen Simmons Twitter Jen Simmons Labs CSS Grid Pinterest / Masonry Layout Question Wes' grid-auto-flow: dense; Experiment grid-auto-flow: dense; Docs caniuse CSS Grid Support - make sure to click the "Show All" button "If someone thinks progressive enhancement means providing a crappy experience for older browsers then they’ve got a lot of reading to do." — Sara Soueidan Benjamin De Cock - @bdc dropping tasty CSS Grid treats all day long on twitter. CSS Grid Animation #1 CSS Grid Animation #2 David K Piano Twitter Flipping Slide Deck on FLIP CSS Grid Template Area ASCII Grid repeat() Grid minmax() CSS Grid nth-row() CSS Sub-Grid Sick Picks Scott: Just My Type Wes: Sick Update on the Caldigit TS3 Dock Tweet us your tasty treats! Wes Bos Scott Tolinski Make sure to include @SyntaxFM

8 Marras 20171h 4min

Buzz Words! WTF Do they mean?! Do They Mean Things?? Let's Find Out! Sponsor Freshbooks - Get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section. The Buzz Words This is the order in which we talk about the different concepts. If you have anything you'd like to add to the next buzz words show, tweet us @SyntaxFM  Serverless / Cloud Functions Composition in functional programming funfunfunction Progressive Enhancement Singleton APIs + SDKs Pure Functions + Side Effects Date-fns Immutable / Mutable / Mutations Immutable.js JavaScript30 Array Cardio Isomorphic / Universal JavaScript Microservices Scoping Closures Model View Controller Pattern Learn Node with a stupid explanation of MVC Bike Shedding Tree Shaking Hoisting ES Next Asynchronous / Synchronous Sick Picks Scott: Ghost in the Wires: My Adventures as the World's Most Wanted Hacker Wes: Apollo Reddit App for iOS Shameless Plugs Scott: React 16 for Everyone Tweet us your tasty treats! Wes Bos Scott Tolinski Make sure to include @SyntaxFM

1 Marras 20171h 4min

Show Notes Q: Rems vs Ems vs Pixels? What do you use? Q: What activity, that isn't developer related, benefits you most as a developer? Becoming a Supple Leopard Q: Is a hot dog a sandwich? 🌭 Q If Google offered you a job today, would you take it? Mike Rowe: Why Entrepreneurs Crave the 'Reverse Commute' Q: How did Wes and Scott Meet? Q: What are your thoughts on CMSs, like WordPress, adding JavaScript frameworks, like React? Q: Where do you find remote work? Q: How do you make money? Q: Can a back-end dev become a good designer? Hero Patterns Steve Schoger's Twitter Q: Do you ever feel tired? Q: What do you think about live streaming? Should we do a Syntax live stream?! Q: What stack should a new developer use? Q: What is your process for deciding on new tools? React FAQ - sign up for Tim's newsletter! Q: Where do you see yourself in 5 years? Sick Picks Scott: Fivestar Notebook Wes: Read about your credit card benefits + perks! Tweet us your tips! Wes Bos Scott Tolinski Make sure to include @SyntaxFM

18 Loka 20171h 10min

Scott and Wes dish out some tasty advice to developers who are new to web development. How do you get better? How do you deal with imposter syndrome? Sponsor Freshbooks - Get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section. Shameless Plugs Wes just updated his ES6 course! Mastering Figma is now Launched! Show Notes This show is light on links :) The Gap by Ira Glass Hackathon Stater Sick Picks Nintendo Switch Creative Market Fonts Tweet us your tips! Wes Bos Scott Tolinski Make sure to include @SyntaxFM

11 Loka 20171h 11min

Scott and Wes detail their current stacks that run their training platforms. From front end code linting to the server side and databases. Sponsor Intro to The Serverless Framework by Loren Stewart. The first 20 people to use the code SYNTAX_FREE will get the course for free! After that make sure to use the code SYNTAX for an extra $10 off. Show Notes Wes' Stack Youtube Video Meteor Node.js Level Up Tutorials is fast! Express Learn Node Passport JS MongoDB Mongoose mLab Hosting Mongohub MongoDB Compass Studio 3T MiniMongo React Styled Components Stylus Lang Metor Sessions Prerender.io React Apollo Cross Storage Victory Charts Cloudinary Tim Thumb Amazon S3 Amazon Cloudfront Backblaze Vimeo Pro Jest Mocha Fixer.io Curreny Conversion API Brain Tree Stripe Mandrill Drip Amazon SES PostMark App (THE BEST) Zurb Inky Juice CSS Inliner Meteor Hosting Meteor Hosting Digital Ocean Zeit Now Heroku Bluehost Sucks Let's Encrypt Cloudflare OOPS I SAID CLOUDFRONT Sick Picks Scott: Focusrite Scarlett 2i2 Wes: Better Bidding Tweet us your tips! Wes Bos Scott Tolinski Make sure to include @SyntaxFM Shameless Plugs Level Up Tuts - check out scott's new shopping cart! Wes just updated his ES6 course!

4 Loka 20171h 19min