2019 YEAR END Definitely Not a Clip Show

2019 YEAR END Definitely Not a Clip Show

In this episode of Syntax, Scott and Wes do a 2019 year in review — the most popular Syntax episodes, what they learned, some personal updates, plans for next year, and more! Prismic - Sponsor Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at prismic.io/syntax. 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:40 - Plans for 2020 Syntax Live March 2019 Plans for 2020 Twitter has done really well for @syntaxfm Community feels great 9:20 - Top 10 Syntax episodes of 2019 Syntax162: The Fundamentals - JS Syntax120: Gatsby vs Next Syntax158: The Fundamentals - HTML + CSS Syntax126: Bootcamps vs School vs Self-Learning Syntax138: What’s New in Web Development Syntax130: The VueJS Show (Scott teaches Wes) Syntax146: CSS the Cool Parts Syntax174: How to Build an API Syntax154: SVGs with Sara Soueidan Syntax106: A Look Forward to 2019 25:17 - Personal stuff Scott Brooklyn Tolinksi 2019 was really tough for me Level Up courses for 12 months Huge changes to my production values and office Huge changes to LUT codebase (React hooks, Typescript, Next.js, Mongoose) Wes New Baby in June / 3 months Paternity Leave Bought a cottage Hardest course to make was Beginner JS — it was a slog, hard to stay motivated at times, with 80 hours of recording alone Course Platform re-write (Next.js) 39:17 - Stuff we learned Scott Better speaker Lots of TypeScript Better debugging Hooks Svelte General improvement in JS writing and programming skills Wes Really good at Vanilla.js DOM API React Hooks Suspense Audio Visualization Shape Detection API - Faces, Barcodes, Text Headless CMS: Prismic, Sanity, WordPress GraphQL, Keystone.js, Hasura Very good understanding of the nitty gritty of JS (closures, objects, this, new keyword, classes, etc.) Links Reactathon freeCodeCamp Podcast CSS Houdini Syntax109: Hasty Treat - CSS Grid Level 2 aka Subgrid Syntax092: React Hooks Dev Mugs TypeScript Svelte Prismic Sanity WPGraphQL Keystone.js Hasura ××× SIIIIICK ××× PIIIICKS ××× Scott: The Dream Podcast Wes: Synology DiskStation DS918+ Shameless Plugs Scott: React & TypeScript For Everyone - Sign up for the year and save 25%! Wes: Beginner Javascript - Use the coupon 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

Avsnitt(960)

Hasty Treat - Freelance Tips - Toxic Clients

Hasty Treat - Freelance Tips - Toxic Clients

In this Hasty Treat, Scott and Wes talk about toxic clients — how to identify them, and what to do about them. Linode - Sponsor Whether you’re working on a personal project or managing enterprise infrastructure, you deserve simple, affordable, and accessible cloud computing solutions that allow you to take your project to the next level. Simplify your cloud infrastructure with Linode’s Linux virtual machines and develop, deploy, and scale your modern applications faster and easier. Get started on Linode today with a $100 in free credit for listeners of Syntax. You can find all the details at linode.com/syntax. Linode has 11 global data centers and provides 24/7/365 human support with no tiers or hand-offs regardless of your plan size. In addition to shared and dedicated compute instances, you can use your $100 in credit on S3-compatible object storage, Managed Kubernetes, and more. Visit linode.com/syntax and click on the “Create Free Account” button to get started. Sentry - Sponsor If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting Sentry.io and using the coupon code TASTYTREAT during sign up. Show Notes 05:33 - Warning Signs of a potential toxic client Doesn’t have project well thought out. Scope creep - Adds on new features while not considering the amount of work required to make them happen. Can be mad when you run out of time or budget. Ill Communicator Contacts you at odd times. Thinks that you should answer every email in an hour. Contacts you in inappropriate ways, via text message, social media. OR doesn’t respond to emails in a timely manner giving you blockers. Jerk The rude client Thinks they can be rude because they are giving you money Hundreds of emails Tries to be flashy upfront (dinners, etc.) Scatterbrain or way too big. Facebook for nurses 18:06 - What to do about toxic clients Communicate your needs clearly. Set expectations. “I work best when…” “I answer emails once every two days” Set clear deadlines for deliverables, feedback and revisions (one revision backed in, more at x hourly rate, etc.). Just be VERY clear. If something doesn’t work for them, they will hopefully tell you. Get things in writing. Put things clearly in a working agreement for your client to approve. That way you have something to show in case things go south and you can say, “You agreed to the following things”. Fire them You can fire clients. Honestly, some of them just aren’t worth the time and effort. It’s usually the cheapest clients who demand the most from you. Don’t let them take more of your time and energy than they are paying for. Firing clients is very simple. Hi so and so, I don’t feel like we’re a good match for this project, so I’ll be canceling our work agreement. Good luck on your project. 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 Aug 202124min

Advice for New Devs

Advice for New Devs

In this episode of Syntax, Scott and Wes talk about advice for new devs, our advice and opinions for how new devs can level up. Sanity - Sponsor Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at sanity.io/create. Get an awesome supercharged free developer plan on sanity.io/syntax. Sentry - Sponsor If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting Sentry.io and using the coupon code TASTYTREAT during sign up. Cloudinary - Sponsor Cloudinary is the best way to manage images and videos in the cloud. Edit and transform for any use case, from performance to personalization, using Cloudinary’s APIs, SDKs, widgets, and integrations. Show Notes 01:59 - Get comfortable with your code not working All of our code is broken much of the time. 02:40 - Compound learning and momentum is your biggest tool There is no formation without repetition. It sucks to hear, but honestly, if you get a little bit better every single day, you will be WAY ahead in years to come. Keep at it, keep chipping away, take the lows and the highs. 04:05 - Learn to read error messages Is this error coming from my code? Is this coming from the library? If so, maybe the library wasn’t expecting that. Is this coming from the browser? An extension? Is it even related? Stack trace is a treasure map 09:42 - Take the time to learn the concepts that scare you They are often easier than they seem (though not every time). 10:40 - We all struggle This stuff is hard — give yourself a break. 12:56 - Taking a walk is good for solving bugs It’s hard to walk away from broken code, but it really helps. 14:33 - Get comfortable with the command line You’ll need it 18:09 - The ability to replicate a design pixel perfect is a valuable skill You will be shocked at how many devs can’t or don’t do this. If you want to avoid spending extra time on something, don’t make the designers tell you to go back and fix simple spacing, color, and detail things. 21:26 - You are on a team Don’t get stuck in the "us vs them" mentality of internal company teams (e.g. devs vs designers). You are all working together to make something. 24:10 - You are not an expert Even if you think you are an expert, you should always be seeking out alternate viewpoints and ideas. You are a student forever in this game. 26:14 - Scaffold with comments It helps keep you organized once you get into the mess 28:30 - From Twitter Tweet thread - https://twitter.com/wesbos/status/1417139639861735424 29:30 - Ben Newton Soft skills are about as important as coding skills if you want to go far. https://twitter.com/BenENewton/status/1417140062211526658 32:46 - Eric McCormick Don’t be afraid to push yourself beyond your comfort zone. https://twitter.com/edm00se/status/1417140503527792640 33:31 - Jason Liggi You don’t have to code for fun. https://twitter.com/Liggi/status/1417141600124346371 35:34 - Andrew Nickerson Start by building a project that’s interesting to you. https://twitter.com/Nickvisual/status/1417140742531674118 37:15 - Michael Powers Ask questions, break things once in a while, learn vanilla everything even if it feels like a waste of time. https://twitter.com/mgrpowers/status/1417141364525912064 39:33 - Jason Liggi Doesn’t matter how long you do this job, MOST stuff out there will probably be unknown and confusing. https://twitter.com/Liggi/status/1417141322478235653 40:14 - Swashata Learn to read documentation https://twitter.com/swashata/status/1417142055436910598 49:59 - Max Stoiber Know your tradeoffs. https://twitter.com/mxstbr/status/1417142461709828101 43:34 - Pat Clarke Build a rapport with PMs/clients beyond the technical. https://twitter.com/LeftShotDev/status/1417142505494269954 44:21 - Musa Barighzaai Leave things better than you found them. https://twitter.com/mbarighzaai/status/1417142734993907715 45:20 - David Moore Build things that excite you. https://twitter.com/DavidIMoore/status/1417145783581741067 Links https://johnlindquist.com/ https://github.com/albertlauncher/albert ××× SIIIIICK ××× PIIIICKS ××× Scott: Raycast Wes: Amazon iPhone Repair Kits Shameless Plugs Scott: Web Components 101 - Sign up for the year and save 25%! Wes: All Courses - Use the coupon 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

25 Aug 202156min

Hasty Treat - Why Do People Hate CSS?

Hasty Treat - Why Do People Hate CSS?

In this Hasty Treat, Scott and Wes talk about why people hate CSS, some common issues, and how you can level up. Prismic - Sponsor Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at prismic.io/syntax. 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 re-player and a performance monitor. Get 14 days free at logrocket.com/syntax. Show Notes 03:20 - Layout is hard block vs inline vs inline-block Learn what this means! Flexbox https://css-tricks.com/snippets/css/a-guide-to-flexbox/ Grid Avoid floats Wes’ Flexbox Course Wes’ CSS Grid Course Scott’s Modern CSS Layouts Course 07:43 - I can’t get my thing to get the right style Use a scoping system like BEM, CSS in JS, CSS Modules Don’t style via IDs Avoid !important 11:00 - My thing isn’t looking the way it’s coded Dev tools Write CSS in the browser Check class names 12:11 - I don’t know if I can delete this CSS Use tools like https://purgecss.com/ http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/ 15:51 - Look at things holistically 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 Aug 202118min

Potluck - Moist code × Memoization × Ready for full-time? × Deadlines × Design ethics × React components × Video hosting × Local fonts × More!

Potluck - Moist code × Memoization × Ready for full-time? × Deadlines × Design ethics × React components × Video hosting × Local fonts × More!

It’s another Potluck! In this episode, Scott and Wes answer your questions about memoization, how to know when you’re ready for a full-time dev job, what to do when you underestimate projects, design ethics, local fonts, and more! Linode - Sponsor Whether you’re working on a personal project or managing enterprise infrastructure, you deserve simple, affordable, and accessible cloud computing solutions that allow you to take your project to the next level. Simplify your cloud infrastructure with Linode’s Linux virtual machines and develop, deploy, and scale your modern applications faster and easier. Get started on Linode today with a $100 in free credit for listeners of Syntax. You can find all the details at linode.com/syntax. Linode has 11 global data centers and provides 24/7/365 human support with no tiers or hand-offs regardless of your plan size. In addition to shared and dedicated compute instances, you can use your $100 in credit on S3-compatible object storage, Managed Kubernetes, and more. Visit linode.com/syntax and click on the “Create Free Account” button to get started. 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 re-player and a performance monitor. Get 14 days free at logrocket.com/syntax. Cloudinary - Sponsor Cloudinary is the best way to manage images and videos in the cloud. Edit and transform for any use case, from performance to personalization, using Cloudinary’s APIs, SDKs, widgets, and integrations. Show Notes 04:07 - Can you explain the concept of memoization in JS? 07:27 - I’ve been developing for a while now and I was wanting to know if there is some sort of catalyst that I should be aware of that screams “you’re ready for a full-time job”? 09:26 - I have an ethics question for you. I recently took on a freelance gig that requires a custom admin dashboard, and I wasn’t really sure how to design one of those. My solution was to look up a pre-made Bootstrap dashboard template that can be purchased for $50-$500, and just re-create it myself. I looked at their live demo and reconstructed a very similar dashboard myself, using the same UI library. The outcome is not a perfect copy, although it’s very close, and I never looked at their code base, so there’s probably many differences there. But still, I can understand why some people might be upset by my attempt to copy someone else’s design. I’m not reselling it as a theme, just using it my freelance project with one client. What are your thoughts on this? 16:36 - How do you decide how specific a (React) component should be? 22:03 - My question is about the npm run eject feature of React. Is there a place where I should be using this feature or can I keep on ignoring that it exists? 24:04 - My question is for Scott. In one of the episodes in the past, you mentioned that you use YouTube private videos on leveluptutorials.com using some kind of authentication. If I am not mistaken, you use a different platform to host videos now. Was there any reason to stop using that technique? 31:13 - I’m setting up a webinar. I’m going to require an iLok drive to access the FTP site, so I head over to Ali Baba, and I’m on Ali Baba to buy the things, and I should mention my main concern would be data miners. I mean they’re just like cyber-crackheads, really. So, I would imagine that any latency issues could be compensated through a registrar handshake with the firmware, and I’d love to see a combination of both flash and HTML5, so my question is, would the eCommerce piece embed on the host platform, as well as the dialogue field for user names? Or, would the gateway socket extension be full duplex, as well as the packet switchover? 33:33 - How do you allow users to edit text to their profile or to messages they send to other users, without sacrificing the safety and security of your site? 38:07 - Any tips on how should I use npm packages in Netlify functions? I read that I could commit node_modules (which for me sounds absolutely barbaric) and I also read that I could install netlify-lambda package with an additional postinstall script in the package.json. What’s your approach? 41:07 - Can you disable local fonts from the OS and check if the site actually loads them? 46:02 - I have a question related to freelancing. Yesterday I took on a new client project. Price is locked in and contract is signed. Thing is, I am new to web dev freelancing and I now realise I have totally miscalculated the complexity and size of this project. What I initially estimated I could do in 3-4 weeks suddenly looks more like 6-8 weeks of work for me. Do I break the bad news for the client and ask to extend the deadline, outsource part of the work (which might lead to more hassle), or just buckle up and prepare to pull several all nighters to get on top of it? What would you do? 49:09 - Question to Scott: Have you ever thought of calling your students Scott’s Tots? Links https://mux.com/ https://vimeo.com/ https://github.com/cure53/DOMPurify https://wesbos.com/sanitize-html-es6-template-strings https://svelte.dev/ https://vercel.com/ https://begin.com/ https://en.wikipedia.org/wiki/Scott%27s_Tots ××× SIIIIICK ××× PIIIICKS ××× Scott: I Think You Should Leave Season 2 Wes: Underground Wire Locator Shameless Plugs Scott: 1: Level Up Tuts Pro - Sign up for the year and save 25%! 2: Become a Level Up Tutorials Author Wes: All Courses - Use the coupon 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

18 Aug 202156min

Hasty Treat - The Weird and Wonderful Link Tag

Hasty Treat - The Weird and Wonderful Link Tag

In this Hasty Treat, Scott and Wes talk about the  tag — why it’s weird and wonderful, and what you can do with it! Sanity - Sponsor Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at sanity.io/create. Get an awesome supercharged free developer plan on sanity.io/syntax. Sentry - Sponsor If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting Sentry.io and using the coupon code TASTYTREAT during sign up. Show Notes 04:16 - What is it? https://ryanflorence.dev/p/ship-weird The link tag is weird. First, it’s not for links! It’s for establishing a relationship between the current HTML document and a resource. 05:11 - CSS / Media attr 07:13 - Web fonts 08:09 - Favicons Syntax 373: Hasty Treat - The Surprisingly Exciting World of Favicons 08:36 - Preload + Prefetch Resource Audio, document, fetch, font, image, script, style, track, video, worker + more 10:15 - Fetch request (shoutout Ryan) 11:27 - Preconnect Consider adding preconnect or dns-prefetch resource hints to establish early connections to important third-party origins. 13:01 - Module 13:30 - Integrity SHA 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 Aug 202116min

How to Build a Website — The Show For Beginners

How to Build a Website — The Show For Beginners

In this episode of Syntax, Scott and Wes talk about the basics of building a website — how to get started for beginners! 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. Sentry - Sponsor If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting Sentry.io and using the coupon code TASTYTREAT during sign up. Mux - Sponsor Mux Video is an API-first platform that makes it easy for any developer to build beautiful video. Powered by data and designed by video experts, your video will work perfectly on every device, every time. Mux Video handles storage, encoding, and delivery so you can focus on building your product. Live streaming is just as easy and Mux will scale with you as you grow, whether you’re serving a few dozen streams or a few million. Visit mux.com/syntax. Show Notes 04:20 - HTML HTML is the language you write to get text and elements to show up on the screen Elements can describe the content they contain p img Or be structural and describe the areas of the website div h header, footer Listen to our ep on HTML elements to learn more about them: Syntax 354: The Surprisingly Exciting World of HTML Elements HTML elements have default styling applied to them before you write any CSS This comes from the browser and can be manipulated However, by default all elements are either block or inline-display 08:11 - CSS If HTML is the bones, CSS is the clothes and skin CSS dictates how a website looks Without CSS, you have text on a blank page and images CSS stands for Cascading Style Sheets (“cascading” being the key word) Adding CSS to a page Link tag Style tag Inline styles Selectors You can select an element on the page via element, class, id, attribute Syntax is selector, brackets, property, value Property A property is what you are changing (e.g. background-color) Value determines how the thing looks background: red; Specificity Specificity is a big part of the cascade. When you apply one style to something, you need to learn how to target things appropriately. This is a huge part of being good at CSS. People develop systems like BEM to organize this General rules - Use elements for base styling and classes for specific styling. Don’t use IDs for styling. !important exists to override everything, but as a general rule, NEVER use it. Seriously. Some interaction Most interaction is done in JavaScript, but CSS has some basics hover, active, focus Pseudo selectors You’ll often see people reaching for libraries to make CSS easier and more consistent Common examples are Bootstrap, Foundation, and TailwindCSS For the most part you’ll want to avoid these until you have a good understanding of the cascade, how CSS works, and how to write good CSS. In addition to properties, you can now write your own custom properties for CSS. While this could be seen as an advanced technique, I believe the new normal is CSS variables first. CSS variables are indicated by —variableName: value; where variable name takes the place of a property. You can then use the variable via var(—variableName) in place of a property. This allows for easy duplication of same values across your style sheet. 37:08 - JavaScript JavaScript is used to add interaction to a website It makes your website dynamic JavaScript the Language We have a base programming language that has nothing to do with HTML It has things like: Variables - ways to store things Numbers + Math Data Containers - Objects and Arrays Functions - Code grouped together to achieve a certain purpose It also has a “Standard Lib” which means JavaScript comes with built-in support for doing common things: Formatting time + money Alerting the user Logging a value to developer tools Capitalizing things Sorting lists of things Round or randomize numbers Fetch data Talk to a sever Promises Logic and flow control JavaScript the DOM When the HTML is loaded, it’s parsed into something called the DOM (Document Object Model) Events JavaScript is mostly event-driven - when something happens, do something else When you click something and want something else to happen There are lots of events mouse, touch, pointer Ready Forms Submit, change, keyboard, etc. Can be used to fetch data fetch() - you’ll often hear it called Ajax, or XMLHttpRequest Can be used to make more HTML Whole set of APIs for creating elements The DOM can be traversed Links https://css-tricks.com/ https://getbootstrap.com/ https://get.foundation/ https://tailwindcss.com/ ××× SIIIIICK ××× PIIIICKS ××× Scott: Tony Hawk’s Pro Skater 1 + 2 Wes: Mini Split Air Conditioner Shameless Plugs Scott: 1: Level Up Tuts Pro - Sign up for the year and save 25%! 2: Become a Level Up Tutorials Author Wes: 1: All Courses - Use the coupon code ‘Syntax’ for $10 off! 2: Javascript Notes & Reference 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 Aug 20211h 1min

Hasty Treat - TypeScript Utility Types

Hasty Treat - TypeScript Utility Types

In this Hasty Treat, Scott and Wes talk about TypeScript utility types — what they are, why you might use them, why they exist, and more! Linode - Sponsor Whether you’re working on a personal project or managing enterprise infrastructure, you deserve simple, affordable, and accessible cloud computing solutions that allow you to take your project to the next level. Simplify your cloud infrastructure with Linode’s Linux virtual machines and develop, deploy, and scale your modern applications faster and easier. Get started on Linode today with a $100 in free credit for listeners of Syntax. You can find all the details at linode.com/syntax. Linode has 11 global data centers and provides 24/7/365 human support with no tiers or hand-offs regardless of your plan size. In addition to shared and dedicated compute instances, you can use your $100 in credit on S3-compatible object storage, Managed Kubernetes, and more. Visit linode.com/syntax and click on the “Create Free Account” button to get started. 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 re-player and a performance monitor. Get 14 days free at logrocket.com/syntax. Show Notes 03:35 - Levels of using TypeScript Typing your code Typing your code, but getting a little bit more dynamic using utility types Creating your own utility types! TypeScript is a language in itself Check out type challenges if you want your mind blown: https://github.com/type-challenges/type-challenges/ https://www.typescriptlang.org/docs/handbook/utility-types.html 07:29 - Partial 08:23 - ReadOnly 09:00 - Required 09:33 - Record A record is an object type that is a bit more restrictive Say you want to store podcast details - name, URL, showCount, etc., but only for Syntax and Shoptalk. 10:47 - Omit I find this one handy when I want to create a “Create Item” type, where it has all the item fields except the ID field 11:34 - Pick Given a type, pick these properties 12:39 - Return Types Gives you the type that is returned from a function. Handy if you need to dynamically generate the type based on a passed function. 13:30 - Case These case types are useful for when you are doing template literal types Uppercase Lowercase Capitalize Uncapitalize 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 Aug 202116min

Potluck - WordPress × 3rd-Party Cloud Services × Backend Hosting × Drupal × Getting Clients × GPS vs BEM × More!

Potluck - WordPress × 3rd-Party Cloud Services × Backend Hosting × Drupal × Getting Clients × GPS vs BEM × More!

It’s another Potluck! In this episode, Scott and Wes answer your questions about WordPress, Drupal, using SSGs, finding clients when you’re just starting out, scoped CSS, and more! Prismic - Sponsor Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at prismic.io/syntax. 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 re-player and a performance monitor. Get 14 days free at logrocket.com/syntax. RevenueCat - Sponsor RevenueCat makes it easy to build and manage iOS and Android in-app purchases. With a few lines of code, RevenueCat provides IAP infrastructure, customer analytics, data integrations, and gives you time back from dealing with edge cases and updates across the platforms. Created by developers, for developers, thousands of the world’s best apps use RevenueCat to power their in-app purchases and subscriptions. Get started for free at revenuecat.com. Show Notes 01:48 - Most small businesses I know have heard of WordPress and it seems like it’s the industry standard for brochure sites. I’m tired of 1-5 page freelance WordPress sites. I love front-end coding and design. Do I need to “sell” people on static sites or are there freelance jobs out there for Vue/React/whatever static sites for developers? I want to stick with small businesses and a few other niches, but I’m tired of drag-and-drop builders in WordPress. Plus, I feel WordPress is overkill for a majority of sites. I just want to code sites and freelance. 08:53 - I wanted to get your opinion on 3rd-party cloud services that provide some application functionality. Things like auth0, Algolia, open cart etc. I work for a large enterprise where there is a real fear of trusting these companies with our data and so everything is built from the ground up, with less time, and we miss out on some of the sweet features these services provide. Do you use many services like this in your production apps and how would you decide which to use? 16:03 - I recently took Wes’ Advanced React course and went on to build my first custom React app! Thanks Wes! When the time came to deploy the app, I was surprised by the asymmetry in hosting options for the front vs. backend. It seems that there are 1000 slick, free-teir options for hosting my front-end. But finding a host for my Keystone backend: barf. I messed around with Heroku but troubleshooting was a nightmare, and I eventually settled on a Digital Ocean droplet. My inner system admin is secretly happy to have another OS instance to manage, but I hate paying 5 dollars a month to host a silly project that will probably never be seen by anyone, and I’m already irritated with the amount of care and feeding the backend needs. What gives? Why are there so many choices for frontend hosts and so few for the backend? Are there hosted backends that have auth, database, image hosting, etc and take care of the nitty-gritty with a newbie-friendly free-tier? Maybe I should I be looking into serverless? 23:21 - Since Drupal has evolved beyond awkward kloog of v7 entity/ctools/json-services/phptemplate erc into v9 with excellent graphql/json/rest support and tomb(?) for non drupal web would you recommend Drupal as for a blogger/businesses’ internal network doc/publishing/communications system (ie Drupal not as website itself)? 29:43 - I have just started my web development freelancing business and I feel like I am having a hard time getting a lot of response from small business who currently don’t even have a website (or have a terrible one). Is there any advice you can give about talking people into hiring a web developer when they CLEARLY need help? I plan to use NextJS and Sanity for all of my sites. My first client project is already built using it and it was a great developer experience! 34:30 - What would you guys consider the best alternative to the BEM naming convention? I personally follow a method with very few classes (I’ve seen this called GPS) which takes advantage of the CSS cascade, but I do think it may suffer from readability problems if I handed my stuff to another developer to work on. Interested to hear your thoughts. 39:16 - I have been self teaching myself web development for a little over a year now and your show has been a big help! I am getting to the point now where I feel I am nearly qualified for jobs and will be starting the application journey soon. I currently work in supply chain management at a big corporation with a background in industrial engineering (of which I hold a Bachelors degree). My question for you is - seeing that I have work experience at a big company and a STEM background, do you think this holds any weight in terms of being qualified for a dev job? What I am mainly wondering is how much I should leverage this during interviews and on my resume. Links https://www.gatsbyjs.com/ https://tina.io/ https://vercel.com/ https://www.netlify.com/ https://circleci.com/ https://github.com/Nexedi/renderjs https://keystonejs.com/ https://www.drupal.org/ https://medium.com/@jescalan/bem-is-terrible-f421495d093a ××× SIIIIICK ××× PIIIICKS ××× Scott: I Was There Too Podcast Wes: Mattias Random Stuff YouTube Channel Shameless Plugs Scott: Advanced Svelte Techniques - Sign up for the year and save 25%! Wes: All Courses - Use the coupon 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

4 Aug 202149min

Populärt inom Politik & nyheter

aftonbladet-krim
svenska-fall
motiv
p3-krim
fordomspodden
blenda-2
rss-viva-fotboll
rss-krimstad
flashback-forever
aftonbladet-daily
rss-sanning-konsekvens
rss-vad-fan-hande
rss-krimreportrarna
rss-frandfors-horna
dagens-eko
sydsvenskan-dok
olyckan-inifran
rss-flodet
rss-svalan-krim
krimmagasinet