Our favourite Productivity Hacks 🔥

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 Scott’s Level 1 Apollo Client with React Course Wes’ Social Media Twitter Instagram Facebook 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

1 Aug 201859min

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

30 Juli 201826min

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 ××× Scott: Octopath Traveler & OST Wes 1: AvE Youtube Channel Wes 2: Mustie1 Youtube Channel Shameless Plugs Scott’s Level Up Tuts Pro 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

25 Juli 20181h 4min

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 Facebook’s Codemod Syntax043 - 20 JavaScript Array and Object Methods to make you a better developer 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

23 Juli 201826min

Scott and Wes give their best advice for beginners, including tech skills, applying for jobs, focus, imposter syndrome, and more… Coffeecup’s CSS Grid Builder Tool — Sponsor Check out Coffeecup’s CSS Grid.cc builder tool and resources to learn, prototype and build next gen layouts with CSS Grid! 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 4:46 - Advice for gaining new skills Patience and momentum are key You likely won’t get anywhere significant in two months Think about where you want to be in five years Start small Start with was excites you and let that drive your exploration Start writing code ASAP. Don’t worry about the right way, just get started. 17:15 - Advice for applying to jobs Apply for everything. Failing an interview is no big deal. Each interview is an opportunity to gain experience Putting yourself out there is huge - one blog post, YouTube video, or open source project will put you miles ahead Have an entrepreneurial mindset - you can negotiate money, hardware, vacation time, flexible schedule, etc. Don’t just google “average salary” Negotiate salaries and perks. 29:32 - Advice for knowing what to focus on What gets you jazzed? Find something cool and figure out how to recreate it. Find a problem and figure out how to solve it - build real things. Don’t focus on tech - tech is just a tool. 38:32 - Advice for impostor syndrome Listen to this podcast! ;) Almost everyone has it. Don’t worry about other people’s progress. You don’t need to know how to do everything, but you should be able to figure out how to learn. 46:45 - Misc advice Evaluate things for yourself - don’t blindly follow the loudest voices on the internet Focus on soft skills as well - time management, communication Get a mentor Health and Hobbies - don’t let yourself burnout Links Ep 044 - How to Learn New Things Quickly Javascript30 ××× SIIIIICK ××× PIIIICKS ××× Scott: Sony A7iii Wes: Zevia Shameless Plugs Scott’s Level Up Tuts Pro Wes’ Stickers 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

18 Juli 20181h

In this Hasty Treat (Short episode) Scott and Wes discuss dot files, what they are, how to use and manage them as well as best practices 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:15 - What is a dot file? Access tokens Settings for editors, etc. 4:40 - Dot file examples .gitignore .gitkeep .rc .babelrc .bashrc .eslintrc .env .DS_Store .editorconfig .meteorignore 23:46 - How to keep your dot files in sync Hot Tip In MacOS, toggle dot files with “Shift + Cmd + .” Links Wes’ dot files repo Prettier 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

16 Juli 201825min

In this highly requested episode, Scott and Wes talk about design systems, what they are, why you may want or need one, how to use them, efficiency, best practices, and much 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:40 Design Systems 101 Wes’ Tweet about Design Systems 9:40 Organizational elements of design systems It’s all about consistency 23:07 Best tools for building design systems and style guides Figma Relay for Figma InVision Design Systems Manager Airbnb Lona Brad Frost’s Pattern Library uiengine 41:52 Where to learn more Links Guide to Design Systems by InVision Shopify’s Design System Mailchimp’s Voice and Tone Zendesk Garden Material Design Awesome Design Systems Design Systems Repo Design Systems Docz Facebook Yoga StorybookJS Stuart Clarke-Frisby Tweet Figma’s Platform Figma Styles and Prototyping Design Systems Newsletter ××× SIIIIICK ××× PIIIICKS ××× Scott: CalDigit TS3 Plus Wes: Picasso Tiles Shameless Plugs Scott’s Level 1 Electron Course Wes’ Advanced React Course (Coming Soon) 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

11 Juli 201856min

In this Hasty Treat (Short episode) Scott and Wes discuss user roles, what to think about when creating your own, security implications, etc. 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:30 How to manage user role systems 11:30 Client side best practices Don’t rely on front-end role systems as a security measure 14:13 Where to store your roles Start simple and get more complex as needed 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

9 Juli 201818min