Advice For Beginners - Tech Skills, Applying for Jobs, Focus, Imposter Syndrome + More
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 Heinä 20181h
Hasty Treat - Dot Files
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 Heinä 201825min
Design Systems
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 Heinä 201856min
Hasty Treat - User Role Systems
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 Heinä 201818min
Potluck EP × Remote Work × Headless WordPress × Good Client Questions × Alternate Careers × React API Credentials
It’s another potluck episode in which Wes and Scott talk about freelancing best practices, tips for working remotely, what they would do if they had to pick a different career, and much 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. 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! Show Notes 4:48 How long should you stay with each job and/or company? 8:20 What is the best way to work remotely? Tips for remote working Have a dedicated space Clear on and off times Have a time for winding down Make specific TODO lists Use blocking software to help you stay focused Switch up the scenery / Work in different places 15:26 What are the trade-offs with using WordPress in a headless setup vs a tradition setup? 21:28 How do you deal with API credentials in React? 27:15 How do you keep an eye on performance with an app/site over the long-term? Check uptime Check the performance features in browser dev tools Use error checking software Host-based performance tools Newrelic pingdom LogRocket 34:28 What happened to Canvas after all the hype around HTML5 a few years ago? 40:15 How do you deal with analysis paralysis? Just get to work - you can always change things later Do research, but don’t let it get in the way of shipping 44:05 If you were forced to change your career (and it had to be something you’ve never done professionally in the past), what would it be? Wes: Some sort of buying and selling (eBay, Amazon, etc,) Example: Buying things at wholesale prices and selling them with a markup Scott: Could go a lot of different directions. Example: DJ, Snowboarding instructor, develop a video game that is a sequel to Cruis’n USA 50:14 As a freelance developer, what are some good questions to ask before taking on a client? Budget Scope Preferred communication methods How do you make money? What are the ultimate goals? Basically, ask as many questions as possible ××× SIIIIICK ××× PIIIICKS ××× Scott: Goodhertz Wes: Audiobook: Anything You Want by Derek Sivers Shameless Plugs Scott’s Level 1 Electron Course Wes’ Courses are all on sale 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
4 Heinä 20181h 3min
Hasty Treat - Domain Management
In this Hasty Treat (Short episode) Scott and Wes discus all things domains. Where to get them, how to set them up and how to safe time managing them all in one place. 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 What is a domain? 4:59 What is DNS? 6:00 Nameservers 8:30 What is a DNS provider? DNS Simple Cloudflare Hover Name Domainr iwantmyname 13:30 Different types of DNS records 17:00 Different kinds of domains .com, .tv, .io, etc. 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
2 Heinä 201827min
Marketing for Developers
Scott and Wes talk about marketing. Specifically how to do marketing if you’re a developer wondering where to start. 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. 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 7:58 - Personal Branding Build trust and reciprocity Be authentic to yourself and let that carry through in your work. Have the guts to put yourself out there and establish yourself as an expert. Speak at conferences Write blog posts Make YouTube videos Be on podcasts Start your own podcast 14:50 - Running a Business Treat people well. Reward your customers. Don’t punish your users. Have a refund policy. 19:26 - Social Media Don’t push people off a platform. Bring content to them that is tailored for that platform. Get in early, before the platform becomes super crowded. YouTube Quality content through quantity. Write good SEO titles. Tease your paid content or create a free one-off. Don’t expect to make a lot of money, but it can be great for growing a brand. Twitter Be helpful - small, digestible tips and tricks and great for growing a Twitter following. Quality is still the key. Steve Schoger is a great example of consistent, high quality content. Facebook People have other interests besides web development. People like to see into your life. Use Facebook to give people a window into who you are. Reddit Reddit is really difficult. It’s easy to get banned. The best strategy is to not focus on marketing and just try to be helpful. It’s sort of replaced forums and is a great place to build communities around different hobbies. Instagram Recently IG has been blowing up for web developers. Dhanish is a perfect example of how to do Instagram well. 49:55 - Paid Advertising Don’t be sleazy. Ads are good for getting likes and driving some traffic to something, but it takes experimentation to get the best bang for you buck. 54:40 - Email marketing Wes: Email is probably responsible for most of my sales. Keeps people up to date and helpful for promoting new courses. Helpful for figuring out what people want. 59:17 - Partnerships A lot of companies want to partner rather than just sponsor. It can be a great way to fund the creation of products/courses. Affiliate programs are great when they work out. 67:30 - Freebies Giving away free content is a surefire way to get people to pay attention. It’s about giving back to the community as much as marketing your products. ××× SIIIIICK ××× PIIIICKS ××× Scott: Cypress: End to end testing Wes: Audiobook: Own the Day, Own Your Life Shameless Plugs Scott’s New Electron Course Wes’ Advanced React and GraphQL Course 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
27 Kesä 20181h 18min
Our Workflows: Design, Development, Git, Deployment
It’s a workflow extravaganza! Scott and Wes talk about their development workflows, covering everything from design to deployment. Coffeecup’s CSS Grid Builder Tool Check out Coffeecup’s CSS Grid.cc builder tool and resources to learn, prototype and build next gen layouts with CSS Grid! VueSchool.io's Vue.js Masterclass 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. Show Notes 4:00 - Design Workflow Wes: Screenshots of look + feels Sketch layouts out in pencil Mock up layout in Sketch Once rough layout is done, I refine Once I have: colors, type, patterns, textures and overall layout, I move to code. A design program is important to vs designing in code Scott Mirrored component structure in Figma Using Ideas from Atomic design and React components Goal is for Figma components to be 100% mapped to styled components Flexible and testable in different layouts My design philosophy is refinement through iteration Light theft Footer from Pitchfork New card animation idea from Patagonia 15:55 - Design to Dev Workflow Wes: Happy with design so far Setup tooling - styled components, stylus, sass… Setup type, variables, partials, resets… Do as much HTML as possible before styling CSS it up for layouts, then go section by section Broad first, then zoom in on finesse Browsersync / Hot Reload Test across browsers / Devices Scott: Define parameters in Figma Styled components in React, hand write that CSS bruh Move aspects of styled components lib like breakpoints, colors, functions, helpers, base components 32:06 - Git Workflow Wes: Tear off a branch - name after issue - DEV113 Do your work Rebase Squash Pull Request Rinse + Repeat Scott Master branch is 1-1 with live Develop is where work is done (but not really because I make a feature branch for each feature and merge in) Contributors issue pull requests into develop 42:34 - Deployment Workflow Scott: Hosted on Meteor Galaxy, container based hosting Develop is merged into master, all tests run, if everything passes tests and manual check, I deploy to Galaxy via NPM script. Soon I’ll be adding in automated test running & auto deploy to galaxy on push to master. Secrets are kept in a settings.json file that’s used during deployment. Wes: Codeship DeployHQ Git Rsync Dealing with secrets 49:53 - Project Folder Structure Wes: Folder Structure - 0100, 0101… Scott: API UI element -> styled components with index Startup Utilities Links BNO Train Wreck Album Atomic Design Guide Design Systems BrowserSync FontSquirrel fontplop Creative Market Delicious Brain’s WP Migrate DB Pro Ryan Dahl - 10 Things I Regret About Node.js ××× SIIIIICK ××× PIIIICKS ××× Scott: Overcooked - Nintendo Switch Wes: SkyRoam Solis Shameless Plugs Scott’s Level 2 React 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
20 Kesä 20181h 6min
