Podcasts about vanilla javascript

JavaScript has seen its fair share of insults and critiques over the years, with some developers outright refusing to touch it and other skirting around the edges by relying heavily on the server-side of things (ie PHP). Love it or hate it, JavaScript is what the web runs on and it's been that way since 1995. Vanilla JavaScript runs in the client's browser, bringing interactivity to user interfaces, while keeping the server out of calculations and computations. With the introduction of Node.js, JavaScript escapes the client-side, and moves it's way into the backend scene. With such a versatile language, why does JavaScript get so much hate? Is JavaScript really that bad? Show Notes: https://www.htmlallthethings.com/podcasts/is-javascript-really-that-bad Learn with Scrimba: https://scrimba.com/links/htmlallthethings

In this episode, Peter discusses the value of vanilla JavaScript. In particular, we talk about the importance of learning the foundations of JavaScript when you're first starting out, the boost given to developers by updates to the JavaScript standard, and the appeal of vanilla JavaScript in a world of breaking dependencies. Shameless PlugsParsitydev30Peter's YouTube channel

const podcast = { episode: 238, title: 'Rise and Fall of JavaScript Libraries', topics: [ 'JavaScript', 'frameworks', 'accessibility' ], guest: 'Chris Ferdinandi' hosts: [ 'Craign Shoemaker', 'Ward Bell' ]};Recording date: 6/1/2023John Papa @John_PapaWard Bell @WardBellDan Wahlin @DanWahlinCraig Shoemaker @craigshoemakerChris Ferdinandi @ChrisFerdinandiBrought to you byAG GridIdeaBladeResources:Go Make Things Newsletter & Morezachleat.comReactPreactWhat Is Server-side Rendering And How Does It Improve Site Speed?What is “Vanilla JavaScript”?Timejumps00:29 Welcome00:47 Introducing Chris Ferdinandi03:30 Why are JavaScript frameworks bad for developers?07:04 Sponsor: Ag Grid08:12 If you take JavaScript out, aren't you limiting apps?22:01 Sponsor: IdeaBlade23:01 How do you minimize your use of JavaScript?28:38 Accessibility and frameworks44:18 Final thoughtsPodcast editing on this episode done by Chris Enns of Lemon Productions.

In today's episode, I talk about common myths about vanilla JS (and why they're wrong).In today's episode, I talk about common myths about vanilla JS (and why they’re wrong).Show Notes & Transcript →

In today's episode, I talk about common myths about vanilla JS (and why they're wrong). Links Vanilla JS performance data The UMD pattern

In this episode, we speak with Chris Ferdinandi. Chris helps people learn vanilla JavaScript at gomakethings.com, and believes there's a simpler, more resilient way to make things for the web. His developer tips newsletter is read by thousands of developers each weekday.  Chris and I talked about his journey, how to make a career transition to web development, how Chris found his niche in vanilla JS and ended up working for himself, and much more. Enjoy!LinksGo Make ThingsResources from this episode SPAs were a mistakeChris' TwitterShameless PlugsJunior to Senior (use code DVY100 to access the course for free)Parsitydev30.xyzPeter's YouTube channel

Welcome back to the HTML All The Things Podcast your web development, web design, and small business headquarters. This week, Matt and Mike discussed whether vanilla JavaScript is viable on modern projects. Vanilla JavaScript is of course the language that the browser understands, but with the increasing complexity in many of today's web development projects, frameworks like React, Vue, and Svelte have seemingly taken over as the tools of choice for web developers. Should you use a framework, or should you use vanilla JavaScript?

Fredrik chats with Chris Ferdinandi about vanilla Javascript, the pros and cons of libraries, the state of web components, and a lot more. Chris tells us about how and why he became the vanilla Javascript guy, and why he dislikes vanilla-js.com. We talk about why we as web developers pick up so many libraries, and why we often seem to use really large tools on really small problems. We wonder if different types of developers should think in different ways about libraries. Chris also talks about how different groups attending his courses approach the subject of vanilla Javascript in different ways, and of course a bit about where he hopes and thinks web development might be heading in the next few years. Thank you Cloudnet for sponsoring our VPS! Comments, questions or tips? We are @kodsnack, @tobiashieta, @oferlund and @bjoreman on Twitter, have a page on Facebook and can be emailed at info@kodsnack.se if you want to write longer. We read everything we receive. If you enjoy Kodsnack we would love a review in iTunes! You can also support the podcast by buying us a coffee (or two!) through Ko-fi. Links Chris Ferdinandi Vanilla Javascript Vanilla JS podcast - Chris' podcast Chris' newsletter gomakethings.com Jquery vanilla-js.com - a joke which may not have stood the test of time Library or framework? ES 5 Post from Dave Rupert about ripping Jquery out of Wordpress Chris' e-books vanillajsguides.com Chris' workshops DOM diffing Dan Abramov Redux Dan Abramov’s course on Redux Vue Svelte Astro The stage 3 API for passing in a string of HTML and sanitizing it JSX Details and summary elements ARIA Web components Chris' course on web components Shadow DOM Constructable stylesheets Titles I help people learn vanilla Javascript Largely because of Jquery The vanilla JS guy The phrase “at scale” gets thrown in there Trying to hang a painting on your wall with a sledgehammer Perfect for a very narrow and specific set of use cases Just throwing one more of them in The pain of their own tech choices Teaching engineers how to find their next job I didn’t realize you could do so much without a library Underneath your library Without punishing the user Mostly HTML and a little bit of Javascript Waiting for the build to compile You never have to feel bored

Learn why Chris Ferdinandi believers there's a simpler, more resilient way to make things for the web with vanilla Javascript. We also take a detour into accessibility. Chris's background and history with web developmentSingle Page ApplicationsLibrariesTiny libraries that Chris recommends at: The Vanilla JS ToolkitAccessibility and best practices with JavaScriptLiving with ADHDJavaScript and education recommendationsRecommendations for novice developers starting outWhat's coming up in JavaScript that Chris is excited aboutGo Make Things - Website 101 Podcast Listener Page Show Links Go Make Things Alpine Js Vue React Angular jQuery WebAIM The Vanilla JS Toolkit The A11Y Project Checklist Sean uses a screen reader A11Y Nutrition Cards - blog post A11Y Nutrition Cards MDN Web Docs - prefers-reduced-motion Vanilla Js Academy Go Make Things - Website 101 Podcast Listener Page More Website 101 Podcast Email the Podcast! Twitter Sean on LinkedIn Mike on LinkedIn Amanda on LinkedIn

We talk to Chris Ferdinandi about vanilla JavaScript, the modern web, newsletters, and more. Links https://gomakethings.com/podrocket http://vanilla-js.com https://preactjs.com https://alpinejs.dev https://www.npmjs.com/package/petite-vue https://css-tricks.com/radeventlistener-a-tale-of-client-side-framework-performance https://svelte.dev https://kit.svelte.dev https://astro.build https://twitter.com/jlengstorf/status/1442707241627385860 https://moderncss.dev https://smolcss.dev Contact us https://podrocket.logrocket.com/contact-us @PodRocketpod (https://twitter.com/PodRocketpod) What does LogRocket do? LogRocket combines frontend monitoring, product analytics, and session replay to help software teams deliver the ideal product experience. Try LogRocket for free today. (https://logrocket.com/signup/?pdr) Special Guest: Chris Ferdinandi.

Greater Than Code Episode #170: The Case for Vanilla JavaScript with Chris Ferdinandi (https://www.greaterthancode.com/the-case-for-vanilla-javascript) 02:50 - Project Gemini (https://gemini.circumlunar.space/) and Text Protocols * Always Bet on JavaScript 07:05 - Overusing Analytics & Tracking Scripts * Be An Advocate For Your Users / Ethical Obligations 12:18 - Innovations: Making Accessibility The Default 14:48 - Ad-Tech and Tooling * Partytown (https://partytown.builder.io/) * Fathom (https://usefathom.com/pjrvs) * Preact (https://preactjs.com/) * Alpine.js (https://github.com/alpinejs/alpine) * petite-vue (https://github.com/vuejs/petite-vue) * Svelte (https://svelte.dev/) * SvelteKit (https://kit.svelte.dev/) * Have Single-Page Apps Ruined the Web? | Transitional Apps with Rich Harris, NYTimes (https://www.youtube.com/watch?v=860d8usGC0o) * Astro (https://astro.build/) 32:08 - HTMX (https://htmx.org/) 46:30 - Frontend Development is Hard * SPA's and Transitional Apps * Federated Multipage Apps * Micro Frontends * Phoenix LiveView (https://github.com/phoenixframework/phoenix_live_view) * Joint Activity * Joint Cognitive Systems: Foundations of Cognitive Systems Engineering (https://www.amazon.com/Joint-Cognitive-Systems-Foundations-Engineering/dp/0849328217) Reflections: Rein: Vanilla JavaScript + Privacy. Jacob: The web piqued at LiveJournal. Also, encouraging devs to think about what tool would be best for different jobs. Chris: Maintaining privacy on the web. Sign up for Chris's newsletter at gomakethings.com (https://gomakethings.com/)! This episode was brought to you by @therubyrep (https://twitter.com/therubyrep) of DevReps, LLC (http://www.devreps.com/). To pledge your support and to join our awesome Slack community, visit patreon.com/greaterthancode (https://www.patreon.com/greaterthancode) To make a one-time donation so that we can continue to bring you more content and transcripts like this, please do so at paypal.me/devreps (https://www.paypal.me/devreps). You will also get an invitation to our Slack community this way as well. Transcript: Coming ASAP! Special Guest: Chris Ferdinandi.

Video content can be found here: https://www.youtube.com/channel/UC0BAd8tPlDqFvDYBemHcQPQ/

In this episode, James explains the basics of getting started with SvelteKit and how it compares to other frameworks, like Next.js.SponsorsVercelVercel combines the best developer experience with an obsessive focus on end-user performance. Their platform enables frontend teams to do their best work. It is the best place to deploy any frontend app. Start by deploying with zero configuration to their global edge network. Scale dynamically to millions of pages without breaking a sweat.For more information, visit Vercel.comZEAL is hiring!Zeal is a computer software agency that delivers “the world's most zealous” and custom solutions. The company plans and develops web and mobile applications that consistently help clients draw in customers, foster engagement, scale technologies, and ensure delivery.Zeal believes that a business is “only as strong as” its team and cares about culture, values, a transparent process, leveling up, giving back, and providing excellent equipment. The company has staffers distributed throughout the United States, and as it continues to grow, Coding Zeal looks for collaborative, object-oriented, and organized individuals to apply for open roles.For more information visit softwareresidency.com/careersShow Notes0:00 Introduction0:51 Sponsor: ZEAL5:09 Context for Learning Svelte and SvelteKit8:00 Landscape of Web Application DevelopmentSPA - Single Page ApplicationAngular, React, and VueServer Side Rendered Pages vs Statically Generated PagesRich Harris, works at The NY Times, is behind Svelte13:16 Svelte is compiled into Vanilla JavaScript = faster applications13:50 Differences in how the frameworks handle HTML/JSX, CSS, and JavaScript15:35 Why people like SvelteDouble Data BindingForm HandlingStores Built-InAnimations Built-In21:29 SvelteKit - Framework for handling routing, caching, statically generated pages, and server-rendered pages24:28 CSS Scoping25:56 Hosting26:33 Sponsor: Vercel28:22 ToolsViteSnowpack29:57 Grab Bag Questions30:17 Grab Bag Question #1: If you were to start a new project, would reach for SvelteKit or Next.js?31:07 Grab Bag Question #2: Are there holes in Svelte or SvellteKit? Things that you see in other frameworks, like React or Vue that you wish were part of Svelte?31:54 Picks and Plugs32:07 James's Pick: OnCloud Tennis Shoes33:09 James's Plug: Learn Build Teach Discord Server33:45 Amy's Pick: Kindle Paperwhite34:37 Amy's Plug: YouTube Video - Debugging in VS Code

Video content can be found here: https://www.youtube.com/channel/UC0BAd8tPlDqFvDYBemHcQPQ/

Recording date: August 25, 2020John Papa @John_PapaWard Bell @WardBellDan Wahlin @DanWahlinCraig Shoemaker @craigshoemakerAlan Davalos @AlanGDavalosBrought to you byag-Grid RaygunActionable error, crash and performance monitoring. Raygun gives you visibility into how users are really experiencing your software. Detect, diagnose and resolve issues with greater speed and accuracy.Resources:Web ComponentsShadow DOMRender HTML with Vanilla JavaScript and LitHTMLCSS Encapsulationlit-htmlPolymer ProjectLitElementLitElement with Vue.jsModel ViewerIooxaHauntedDefining a property in LitElementEvents in LitElementWeb Component BenchmarkFASTVanilla JavaScript and HTML - No frameworks. No libraries. No problemWeb Component BenchmarkOpen WCCool Components (LitElement)ModelviewerStripe ElementsWiredJSChessboard elementsUni VirtualizerIooxaApollo ElementsLottie PlayerCool Components (Not LitElement)CSS DoodleShader DoodleBlock LinkButton Element on Google PayWhite Label ComponentsLionGeneric ComponentsAlan on Dev.toTimejumps01:32 Guest introduction02:50 What is LitElement?07:17 What is CSS encapsulation?10:18 Sponsor: Raygun10:49 Wrapping everything into a component13:34 How does LitElement help with templating?22:57 Is LitElement able to integrate with other components?35:56 How do you define an attribute value?40:33 Sponsor: Ag Grid41:34 How does Fast compare with LitElements?47:42 Where to go to learn more50:13 Final thoughtsPodcast editing on this episode done by Chris Enns of Lemon Productions.

Chris Ferdinandi helps people learn vanilla JavaScript. He believes there’s a simpler, more resilient way to make things for the web. His developer tips newsletter is read by thousands of developers each weekday. Learn more at GoMakeThings.com.

00:53 - Chris’s Superpower: Derailing conversations and having a knack for taking complex tasks and breaking them down into smaller, simpler parts that people find easy to understand. 01:44 - The Pitch for Vanilla JavaScript 03:06 - Peoples’ Biggest Challenge as a Developer * Having Trouble Keeping Up * Adding Processes and Tools Make it More Difficult to Get Started * “The Right Way To Do It” 05:50 - The Problem With The Way We Do Things Today * Front-End Development * Back-End Developers Move to Front-End 08:30 - Modern Web Development * The Use of Frameworks * Package Managers * “The Cascade is Bad” - Using More JavaScript 11:42 - A Better Approach To Web Development * Sometimes Old Is Better * Don’t Ditch The Old Just Because Something New Came Out * Embrace The Platform * Think Smaller And More Modular * Remember That The Web Is For Everyone 17:15 - CSS and JavaScript * Web Bloat That Affects The End User * Accessibility - Being Able To Work On Improvement * Accessibility Audit On Gutenberg (https://wpcampus.org/2019/05/gutenberg-audit-results/) * Being Too Heavily Focused On One Programming Language 25:05 - The Notion of Development At Scale * The Google Hiring Process And Frameworks 27:45 - Silos Of Technology 31:10 - Complexity And/Or Simplicity * Focusing On Quality Over Volume * Factoring For Growth 37:20 - Advocating For Vanilla JavaScript * Documentation * Unexpected Incidentals 44:10 - Gradual Movement Of The Code Base 45:30 - Using The Word “Just” 49:30 - The Concept Of State 52:45 - Use Of Static HTML 53:40 - Do Companies Actually Build For The Web Like This * Netflix Page Loads With Vanilla JS * Happy Middle Ground 58:05 - Summation Of Positives Of Vanilla JavaScript * Ease Of Beginner Developer Onboarding * Allowing Non-JavaScript Developers To Participate More Meaningfully In Your Process * Overall Resilience And Performance For The End User Reflections: Rein: Pick the thing that reduces your suffering the most. Jacob: If you are just starting to learn JavaScript, it is ok to not learn a framework immediately. It is also ok to dive into something else and come back to learn vanilla JS. Also, Noel Rappin - Modern Front-End Development for Rails (https://pragprog.com/book/nrclient/modern-front-end-development-for-rails), takes a great approach to using differing technologies and what they can bring to your project. Chris: Thinking about the instances where it does make sense to use some of these tools as opposed to reasons why you shouldn’t use them. Liked the talk about minimizing your pain. If you feel like there are too many moving parts to JavaScript, you are not alone, it’s not you, and you’ve totally got this. This episode was brought to you by @therubyrep (https://twitter.com/therubyrep) of DevReps, LLC (http://www.devreps.com/). To pledge your support and to join our awesome Slack community, visit patreon.com/greaterthancode (https://www.patreon.com/greaterthancode) To make a one-time donation so that we can continue to bring you more content and transcripts like this, please do so at paypal.me/devreps (https://www.paypal.me/devreps). You will also get an invitation to our Slack community this way as well. Amazon links may be affiliate links, which means you’re supporting the show when you purchase our recommendations. Thanks! Special Guest: Chris Ferdinandi.

You may not need JQuery.You may not need lodash.You may not need moment.js.Learning javascript design patterns. Javascript Patterns.Web Accessibility by Google.Web Content Accessibility Guidelines (WCAG) 2.1.Web AIM - Accessibility in Mind.Geolocation API.HTML Media Capture (Accessing user camera).Shadow DOM v1: Self-Contained Web Components.Angular CSS View Encapsulation ( one, two).A guide to React onClick event handlers. What the heck is the event loop anyway? | Philip Roberts | JSConf EUJake Archibald: In The Loop - JSConf.Asia. Understanding OAuth2.Protecting Your Cookies: HttpOnly.Professional JavaScript for Web Developers, 4th Edition.Typescript Discussion.

Recording date: 2019-12-10John Papa @John_PapaWard Bell @WardBellDan Wahlin @DanWahlinCraig Shoemaker @craigshoemakerEly Lucas @ElyLucasResources:Six Million Dollar ManThe Bionic WomanIonic FrameworkIonic React DocsReact NativeMax Lynch - co-founder of IonicJQuery MobileCordovaAngularJSCreate React AppService WorkerProgressive Web App - PWACapacitorIonic Capacitor vs Apache Cordova Difference With Example — The Next Future Innovation of Hybrid Native AppsFlutterNative Web APIs for accessing device features such as cameraWhat is CapacitorCanIUse.comTest with JestIonic React HooksUsing react hooks in IonicIonic Vue betaAnnouncing Ionic React HooksTimejumps02:33 Guest intro04:31 What is Ionic?09:03 Why is it important that Ionic works across frameworks?09:47 Sponsor: Ag Grid10:51 What can the latest version of Ionic do?15:06 Why should I use Ionic instead of React Native?19:40 Who is the audience for this?27:46 Sponsor: IdeaBlade28:51 How do you access phone features from Ionic?34:52 How is testing done?43:49 What about Vue or Vanilla Javascript?45:11 Final thoughts

Recording date: 2019-12-03John Papa @John_PapaWard Bell @WardBellDan Wahlin @DanWahlinCraig Shoemaker @craigshoemakerResources:Fast Food Frameworks - Chris LoveVanilla JavaScript"Can I use" web siteaddEventListenerLIT HTMLlit-html docsOrder 66Timejumps02:25 Why?10:06 Why not use Fetch?16:52 Sponsor: Ag Grid17:56 What is a template?26:02 Sponsor: IdeaBlade27:13 How do you feel about JSX?42:34 What did we learn?

VideoYouTubeOur SponsorTrackJSJavaScript breaks sometimes. Even the code you write. You need to know when things start crashing in production.TrackJS Front-End Monitoring quickly integrates with your front-end or node application, regardless of framework, so you know when a bug gets out. TrackJS installs in minutes, and you get context about what the user, network, and application were doing before an error. It's like having an airplane's blackbox in your UI, so you can find, recreate, and fix problems fast.TrackJS is an engineer-owned cloud service that will make your JavaScript better and your website more reliable. Try it free at TrackJS.com.Today’s GuestChris Ferdinandi@ChrisFerdinandiWelcome, Script & Style listeners! | Go Make ThingsYour HostsDavid Walsh@davidwalshbloghttps://davidwalsh.nameTodd Gardner@toddhgardnerhttps://todd.mnEpisode SummaryVanilla JavaScriptChris Ferdinandi is a Frontend developer and advocate for Vanilla JavaScript. He runs GoMakeThings, a JavaScript learning platform.Chris’s Origin Storyhttps://gomakethings.com/The HR Guy who knows TechMaking things that run in a browser was a thrillWhy should people learn vanilla JavaScript over React, Angular, Vue, Etc.?Tell us about the Lean Webhttps://leanweb.dev/Thomas Fuchs coined term, “The LeanWeb”This was a tweet that turned into some blog posts that turned into a talk that turned into an ebook and site.Key thesis: The web is a bloated, over-engineered mess, and many of our modern “best practices” are actually making the web worse.Key principles: Embrace the Platform, Small & Modular, and The Web is for Everyonehttp://youmightnotneedjs.com/https://vanillajstoolkit.com/

In this episode Matt and Mike discuss JavaScript in all its glory. They go over things like how beneficial vanilla JavaScript is to learn, especially when you're first starting out, and also explore why you shouldn't dive straight into learning a framework without knowing the basics. Then for our Web News segment, we have Sean from Rabbitwerks JavaScript call in for a discussion on the changes that VueJS 3 bring to the table and the controversy surrounding those changes.  Show Notes: https://www.htmlallthethings.com/Podcast/5d13bab86a070d0011eb6563 You can find us on... Facebook | Twitter | Instagram RSS | Patreon | Spotify Medium | YouTube | GitHub  Reddit | Discord

Who’s the mystery voice that only gets better as you listen to this episode? Actually, you’re probably already familiar with the work of the man behind the microphone. Derrick is busy moving to a new home, so Ben’s co-host is Brian Casel of BootstrappedWeb, ProcessKit, Audience Ops, and Sunrise KPI. Today’s Topics Include: Ben and Brian just got back from MicroConf; it’s an annual gathering of “all our people” Some talks were among their favorites, but others were mediocre and missed the mark Brian’s goal was to meet 5-10 new people doing interesting things, and reconnect and catch up with others he’s known for years Brian is an Art of Product (AoP) podcast listener and wants Ben and Derrick to not hold back, dig in, challenge each other, and ask more questions Are more people listening to Ben and Derrick’s podcast? Fireside metrics reveal that a lot of Tuple or Level customers come from listening to it More bootstrappers need to start a podcast and find friends to share ups and downs What happened when Ben pushed Brian to learn how to code? ProcessKit - best thing Brian’s built on the Web Phenomenon of how programmers love complexity ProcessKit pricing and customer research; Ben’s advice to get people to buy/use it Tuple Update: App is great; Ben’s been emailing list, and people are buying it Links and resources: Brian Casel (https://briancasel.com/) BootstrappedWeb Podcast (http://bootstrappedweb.com/) ProcessKit (https://processkit.com/) Brian Casel on Product Hunt (https://www.producthunt.com/@casjam) Audience Ops (https://audienceops.com/) Ops Calendar (https://opscalendar.com) Big Snow Tiny Conf (https://bigsnowtinyconf.com/) Sunrise KPI (https://betalist.com/startups/sunrise-kpi) Art of Product Podcast Episode 58 with Brian Casel: Evolving Roles as a Startup Founder (https://artofproductpodcast.com/episode-58) MicroConf (https://www.microconf.com/) MicroConf Recap (https://microconf.gen.co/) Chris Savage: How an Offer to Sell Wistia Inspired Us to Take On $17M in Debt (https://microconf.gen.co/chris-savage/) Jason Fried: Q+A with Jason Fried (https://microconf.gen.co/jason-fried/) Patrick Campbell: Pricing (https://microconf.gen.co/patrick-campbell-starter/) Joanna Wiebe: Money Words: Seven of the words and phrases we use most often in high-converting copy (https://microconf.gen.co/joanna-wiebe/) Fireside (https://fireside.fm/) Transistor (https://transistor.baremetrics.com/) Castos (https://castos.com/) Blubrry (https://create.blubrry.com) AJAX JavaScript (https://en.wikipedia.org/wiki/Ajax_(programming)) Tailwind CSS (https://tailwindcss.com/) Honeybadger (https://www.honeybadger.io/) React (https://reactjs.org/) Ruby on Rails (https://rubyonrails.org/) Vue.js (https://vuejs.org/) Stimulus JavaScript (https://stimulusjs.org/) Vanilla JavaScript (http://vanilla-js.com/) FollowUp.cc (https://followup.cc/) Superhuman (https://superhuman.com/) Art of Product on Twitter (https://twitter.com/artofproductpod) Derrick Reimer (http://www.derrickreimer.com) Website Derrick Reimer on Twitter (https://twitter.com/derrickreimer) Ben Orenstein (http://www.benorenstein.com/) Website Ben Orenstein on Twitter (https://twitter.com/r00k?lang=en) Level (https://level.app/) Tuple (https://tuple.app/) Tuple’s Pair Programming Guide (https://tuple.app/pair-programming-guide)

This is a very experimental episode where I walk listeners through how to add dark mode to your website. I discuss reasons you should add dark mode to your website too!! Show Notes: Buy the book I wrote use the code "baib" to get the book for free Get a free list of the tools I use to make the podcast Open Podcast Forum Open Podcast Blog Open Podcast Website BAIB Episode Page BAIB Email List Support this podcast Published on April 8, 2019

This is a very experimental episode where I walk listeners through how to add dark mode to your website. I discuss reasons you should add dark mode to your website too!! I live-streamed it on Twitch: https://www.twitch.tv/videos/404722053 Support the podcast editing and hosting email me any questions: srhpodcast@gmail.com I'm on Twitter: https://twitter.com/SupremeRumHam Blog: http://supremerumham.wordpress.com Join the email list I'll send the episodes directly to your inbox: http://eepurl.com/gj04vH Published on April 8, 2019

Panel: Charles Max Wood Aimee Knight Chris Ferdinandi Joe Eames Special Guest: Heydon Pickering In this episode, the panel talks with Heydon Pickering who is a designer and writer. The panel and the guest talk about his new book, which is centered on the topic of today’s show: inclusive components. Check out Heydon’s Twitter, Website, GitHub, and Mastodon social accounts to learn more about him. To purchase the book – go here! Show Topics: 0:00 – Advertisement: KENDO UI 0:38 – Chuck: Aimee, Chris, Joe, and myself – we are today’s panel. My show the DevRev is available online to check it out. 1:30 – Guest: Plain ice cream would be frozen milk and that would be terrible. So I am lemon and candy JavaScript! 2:13 – Chuck: We are talking today about...? 2:22 – Chris: He’s talking about “inclusive components” today! 2:41 – Guest: Traveling is very stressful and I wanted something to do on the plane. I’ve done this book, “Inclusive Design Patterns.” If you don’t want to buy the book you can go to the blog. I have been talking with Smashing Magazine. 5:40 – Panel. 5:47 – Guest: I approached Smashing Magazine initially. They didn’t think there was a market for this content at the time. They were very supportive but we will do it as an eBook so our costs our down. At the time, the editor came back and said that: “it was quite good!” We skimmed it but came back to it now and now the content was more relevant in their eyes. I didn’t want to do the same book but I wanted to do it around “patterns.” Rewriting components is what I do all the time. I use Vanilla JavaScript. Backbone.js is the trendy one. 9:52 – Panel: The hard book did it get published? 10:02 – Guest: We are in the works and it’s all in the final stages right now. It has to go through a different process for the print version. 11:54 – Panel. 11:58 – (Guest continues about the editorial process.) 12:09 – Panel: They probably switched to TFS – it’s Microsoft’s. 12:23 – Guest: There was this argument on Twitter about the different processors. 13:35 – Chris: What are the ways that people are breaking accessibility with their code through JavaScript?  13:59 – Guest: The whole premise is that there aren’t a ton of different components that we use. Generally, speaking. Most things we do through JavaScript – it’s just different ways of doing this/that, and hiding things. I am discounting things with Node or other stuff. Most of what we are doing, with interactive design, is showing and hiding. 18:37 – Chris: I have some specialty friends where they tell me where I’ve screwed up my code. For example Eric Bailey and Scott O’Hara but, of course, in very kind ways. What are some things that I can make sure that my code is going to work for many different people. 19:18 – Guest: You have accessibility and inclusive design. People think of accessibility as a check-list and that’s okay but there could be problems with this. 26:00 – Panel: That’s a great guideline. 26:05 – Chris: You talked about ARIA roles and it can be confusing. One side is: I don’t know when to use these and the other side is: I don’t know when NOT to use these so I’m going to use them for EVERYTHING! I guess both can be detrimental. What’s your advice on this topic? 27:00 – Guest: Scott is great and I would trust him to the end of the Earth about what he says. Guest mentions Léonie Watson and her talks about this topic. 29:26 – (Guest continues.) 29:36 – Advertisement – Sentry.io 30:31 – Chris. 30:40 – Guest: There is a lot of pressure, though, right? People wouldn’t blog about this if it wasn’t worthwhile. It doesn’t matter what the style is or what the syntax is. The guest talks about not throwing ARIA onto everything. 36:34 – Aimee: Is this something that was mentioned in the book: people with disabilities and accessibility. 37:28 – Guest: Yes, of course. I think it’s important to make your interfaces flexible and robust to think and include people with disabilities. 39:00 – Guest mentions larger buttons. 40:52 – Panelists and Guest talk back-and-forth. 42:22 – Chris: It’s an accessibility and inclusivity element. I saw a dropdown menu and worked great on certain devices but not others. I could beat this horse all day long but the whole: what happens of the JavaScript file doesn’t load or just accordion options? 43:50 – Guest: It’s the progressive enhancement element. 44:05 – Guest: I think it’s worth noting. I think these things dovetail really nicely. 46:29 – Chris: Did you do a video interview, Aimee, talking about CSS? Is CSS better than JavaScript in some ways I don’t know if this is related or not? 47:03 – Aimee: When I talk about JavaScript vs. CSS...the browser optimizes those. 47:27 – Aimee: But as someone who loves JavaScript...and then some very talented people taught me that you have to find the right tool for the job. 47:29 – Guest: I am the other way around – interesting. 52:50 – Chuck: Picks! 52:55 – Advertisement – Get A Coder Job! END – Advertisement: CacheFly! Links: JavaScript Backbone.js Microsoft’s TFS Léonie Watson React Elixir Ember.js Vue GO jQuery Node.js Puppeteer Cypress Heydon’s GitHub Heydon’s Mastodon Heydon’s Book Medium Article on Heydon Heydon’s Website Heydon’s Twitter Sponsors: DevLifts Kendo UI Sentry CacheFly Picks: Joe Chris Ferdinandi's Blog Luxur board game Cypress.io Aimee Blog about interviewing Birthday Cake Quest Bar Chris Web Dev Career Guide: https://gomakethings.com/career-guide/ Use FREECAREER at checkout to get it for free Neapolitan Ice Cream  Netflix Web Performance case study Charles Disney Heroes Battle Mode MFCEO Project Podcast Gary Lee Audio Experience Suggestions for JavaScript Jabber Heydon Bruck What is Mastodon and why should I use it?

Panel: Charles Max Wood Aimee Knight Chris Ferdinandi Joe Eames Special Guest: Heydon Pickering In this episode, the panel talks with Heydon Pickering who is a designer and writer. The panel and the guest talk about his new book, which is centered on the topic of today’s show: inclusive components. Check out Heydon’s Twitter, Website, GitHub, and Mastodon social accounts to learn more about him. To purchase the book – go here! Show Topics: 0:00 – Advertisement: KENDO UI 0:38 – Chuck: Aimee, Chris, Joe, and myself – we are today’s panel. My show the DevRev is available online to check it out. 1:30 – Guest: Plain ice cream would be frozen milk and that would be terrible. So I am lemon and candy JavaScript! 2:13 – Chuck: We are talking today about...? 2:22 – Chris: He’s talking about “inclusive components” today! 2:41 – Guest: Traveling is very stressful and I wanted something to do on the plane. I’ve done this book, “Inclusive Design Patterns.” If you don’t want to buy the book you can go to the blog. I have been talking with Smashing Magazine. 5:40 – Panel. 5:47 – Guest: I approached Smashing Magazine initially. They didn’t think there was a market for this content at the time. They were very supportive but we will do it as an eBook so our costs our down. At the time, the editor came back and said that: “it was quite good!” We skimmed it but came back to it now and now the content was more relevant in their eyes. I didn’t want to do the same book but I wanted to do it around “patterns.” Rewriting components is what I do all the time. I use Vanilla JavaScript. Backbone.js is the trendy one. 9:52 – Panel: The hard book did it get published? 10:02 – Guest: We are in the works and it’s all in the final stages right now. It has to go through a different process for the print version. 11:54 – Panel. 11:58 – (Guest continues about the editorial process.) 12:09 – Panel: They probably switched to TFS – it’s Microsoft’s. 12:23 – Guest: There was this argument on Twitter about the different processors. 13:35 – Chris: What are the ways that people are breaking accessibility with their code through JavaScript?  13:59 – Guest: The whole premise is that there aren’t a ton of different components that we use. Generally, speaking. Most things we do through JavaScript – it’s just different ways of doing this/that, and hiding things. I am discounting things with Node or other stuff. Most of what we are doing, with interactive design, is showing and hiding. 18:37 – Chris: I have some specialty friends where they tell me where I’ve screwed up my code. For example Eric Bailey and Scott O’Hara but, of course, in very kind ways. What are some things that I can make sure that my code is going to work for many different people. 19:18 – Guest: You have accessibility and inclusive design. People think of accessibility as a check-list and that’s okay but there could be problems with this. 26:00 – Panel: That’s a great guideline. 26:05 – Chris: You talked about ARIA roles and it can be confusing. One side is: I don’t know when to use these and the other side is: I don’t know when NOT to use these so I’m going to use them for EVERYTHING! I guess both can be detrimental. What’s your advice on this topic? 27:00 – Guest: Scott is great and I would trust him to the end of the Earth about what he says. Guest mentions Léonie Watson and her talks about this topic. 29:26 – (Guest continues.) 29:36 – Advertisement – Sentry.io 30:31 – Chris. 30:40 – Guest: There is a lot of pressure, though, right? People wouldn’t blog about this if it wasn’t worthwhile. It doesn’t matter what the style is or what the syntax is. The guest talks about not throwing ARIA onto everything. 36:34 – Aimee: Is this something that was mentioned in the book: people with disabilities and accessibility. 37:28 – Guest: Yes, of course. I think it’s important to make your interfaces flexible and robust to think and include people with disabilities. 39:00 – Guest mentions larger buttons. 40:52 – Panelists and Guest talk back-and-forth. 42:22 – Chris: It’s an accessibility and inclusivity element. I saw a dropdown menu and worked great on certain devices but not others. I could beat this horse all day long but the whole: what happens of the JavaScript file doesn’t load or just accordion options? 43:50 – Guest: It’s the progressive enhancement element. 44:05 – Guest: I think it’s worth noting. I think these things dovetail really nicely. 46:29 – Chris: Did you do a video interview, Aimee, talking about CSS? Is CSS better than JavaScript in some ways I don’t know if this is related or not? 47:03 – Aimee: When I talk about JavaScript vs. CSS...the browser optimizes those. 47:27 – Aimee: But as someone who loves JavaScript...and then some very talented people taught me that you have to find the right tool for the job. 47:29 – Guest: I am the other way around – interesting. 52:50 – Chuck: Picks! 52:55 – Advertisement – Get A Coder Job! END – Advertisement: CacheFly! Links: JavaScript Backbone.js Microsoft’s TFS Léonie Watson React Elixir Ember.js Vue GO jQuery Node.js Puppeteer Cypress Heydon’s GitHub Heydon’s Mastodon Heydon’s Book Medium Article on Heydon Heydon’s Website Heydon’s Twitter Sponsors: DevLifts Kendo UI Sentry CacheFly Picks: Joe Chris Ferdinandi's Blog Luxur board game Cypress.io Aimee Blog about interviewing Birthday Cake Quest Bar Chris Web Dev Career Guide: https://gomakethings.com/career-guide/ Use FREECAREER at checkout to get it for free Neapolitan Ice Cream  Netflix Web Performance case study Charles Disney Heroes Battle Mode MFCEO Project Podcast Gary Lee Audio Experience Suggestions for JavaScript Jabber Heydon Bruck What is Mastodon and why should I use it?

Panel: Charles Max Wood Aimee Knight Chris Ferdinandi Joe Eames Special Guest: Heydon Pickering In this episode, the panel talks with Heydon Pickering who is a designer and writer. The panel and the guest talk about his new book, which is centered on the topic of today’s show: inclusive components. Check out Heydon’s Twitter, Website, GitHub, and Mastodon social accounts to learn more about him. To purchase the book – go here! Show Topics: 0:00 – Advertisement: KENDO UI 0:38 – Chuck: Aimee, Chris, Joe, and myself – we are today’s panel. My show the DevRev is available online to check it out. 1:30 – Guest: Plain ice cream would be frozen milk and that would be terrible. So I am lemon and candy JavaScript! 2:13 – Chuck: We are talking today about...? 2:22 – Chris: He’s talking about “inclusive components” today! 2:41 – Guest: Traveling is very stressful and I wanted something to do on the plane. I’ve done this book, “Inclusive Design Patterns.” If you don’t want to buy the book you can go to the blog. I have been talking with Smashing Magazine. 5:40 – Panel. 5:47 – Guest: I approached Smashing Magazine initially. They didn’t think there was a market for this content at the time. They were very supportive but we will do it as an eBook so our costs our down. At the time, the editor came back and said that: “it was quite good!” We skimmed it but came back to it now and now the content was more relevant in their eyes. I didn’t want to do the same book but I wanted to do it around “patterns.” Rewriting components is what I do all the time. I use Vanilla JavaScript. Backbone.js is the trendy one. 9:52 – Panel: The hard book did it get published? 10:02 – Guest: We are in the works and it’s all in the final stages right now. It has to go through a different process for the print version. 11:54 – Panel. 11:58 – (Guest continues about the editorial process.) 12:09 – Panel: They probably switched to TFS – it’s Microsoft’s. 12:23 – Guest: There was this argument on Twitter about the different processors. 13:35 – Chris: What are the ways that people are breaking accessibility with their code through JavaScript?  13:59 – Guest: The whole premise is that there aren’t a ton of different components that we use. Generally, speaking. Most things we do through JavaScript – it’s just different ways of doing this/that, and hiding things. I am discounting things with Node or other stuff. Most of what we are doing, with interactive design, is showing and hiding. 18:37 – Chris: I have some specialty friends where they tell me where I’ve screwed up my code. For example Eric Bailey and Scott O’Hara but, of course, in very kind ways. What are some things that I can make sure that my code is going to work for many different people. 19:18 – Guest: You have accessibility and inclusive design. People think of accessibility as a check-list and that’s okay but there could be problems with this. 26:00 – Panel: That’s a great guideline. 26:05 – Chris: You talked about ARIA roles and it can be confusing. One side is: I don’t know when to use these and the other side is: I don’t know when NOT to use these so I’m going to use them for EVERYTHING! I guess both can be detrimental. What’s your advice on this topic? 27:00 – Guest: Scott is great and I would trust him to the end of the Earth about what he says. Guest mentions Léonie Watson and her talks about this topic. 29:26 – (Guest continues.) 29:36 – Advertisement – Sentry.io 30:31 – Chris. 30:40 – Guest: There is a lot of pressure, though, right? People wouldn’t blog about this if it wasn’t worthwhile. It doesn’t matter what the style is or what the syntax is. The guest talks about not throwing ARIA onto everything. 36:34 – Aimee: Is this something that was mentioned in the book: people with disabilities and accessibility. 37:28 – Guest: Yes, of course. I think it’s important to make your interfaces flexible and robust to think and include people with disabilities. 39:00 – Guest mentions larger buttons. 40:52 – Panelists and Guest talk back-and-forth. 42:22 – Chris: It’s an accessibility and inclusivity element. I saw a dropdown menu and worked great on certain devices but not others. I could beat this horse all day long but the whole: what happens of the JavaScript file doesn’t load or just accordion options? 43:50 – Guest: It’s the progressive enhancement element. 44:05 – Guest: I think it’s worth noting. I think these things dovetail really nicely. 46:29 – Chris: Did you do a video interview, Aimee, talking about CSS? Is CSS better than JavaScript in some ways I don’t know if this is related or not? 47:03 – Aimee: When I talk about JavaScript vs. CSS...the browser optimizes those. 47:27 – Aimee: But as someone who loves JavaScript...and then some very talented people taught me that you have to find the right tool for the job. 47:29 – Guest: I am the other way around – interesting. 52:50 – Chuck: Picks! 52:55 – Advertisement – Get A Coder Job! END – Advertisement: CacheFly! Links: JavaScript Backbone.js Microsoft’s TFS Léonie Watson React Elixir Ember.js Vue GO jQuery Node.js Puppeteer Cypress Heydon’s GitHub Heydon’s Mastodon Heydon’s Book Medium Article on Heydon Heydon’s Website Heydon’s Twitter Sponsors: DevLifts Kendo UI Sentry CacheFly Picks: Joe Chris Ferdinandi's Blog Luxur board game Cypress.io Aimee Blog about interviewing Birthday Cake Quest Bar Chris Web Dev Career Guide: https://gomakethings.com/career-guide/ Use FREECAREER at checkout to get it for free Neapolitan Ice Cream  Netflix Web Performance case study Charles Disney Heroes Battle Mode MFCEO Project Podcast Gary Lee Audio Experience Suggestions for JavaScript Jabber Heydon Bruck What is Mastodon and why should I use it?

Panel: Joe Eames John Papa Erik Hatchett Charles Max Wood Special Guest: Miriam Suzanne In this episode, the panel talks with Miriam Suzanne who is an author, performer, musician, designer, and web developer who works with OddBird, Teacup, Gorilla, Grapefruit Lab, and CSS Tricks. She’s the author of Riding SideSaddle and the Post-Obsolete Book, co-author of Jump Start Sass, and creator of the Susy and True Open-Source toolkits. The panel and the guest talk about Fonts! Show Topics: 0:00 – Advertisement – Kendo UI 0:53 – Guest: Hello! 1:01 – Guest: I am a designer and a developer and started a business with my brother. We are two college dropouts. 2:00 – Panel: Is that’s why it’s called OddBird? 2:05 – Guest: Started with Vue and have been talking at conferences. 2:31 – Chuck: Chris invited you and he’s not here today – go figure! 2:47 – Panel: You are big in the CSS world. 2:58 – Guest: That’s where I’ve made my name. I made a grid system that was popular at one moment in time. 3:17 – Panel. 3:27 – Panel: Grid Systems are... 3:36 – Guest talks about her grid system and how it looked. 4:20 – Panel. 4:24 – Panel goes back-and-forth! 5:24 – Chuck. 5:27 – Guest: That’s why grid systems came out in the first place b/c layout was such a nightmare. When I built Susy... 6:02 – How much easier is design today on modern browsers compared to ten years ago when you created Susy? 6:14 – Guest: It can look daunting but there are great guides out there! 7:04 – Panel asks a question. 7:11 – Guest: We recommend a stack to our clients. We had been using backbone Marinette for a while and we wanted to start messing with others. Looking at other frameworks. Looking at design, I like that Vue doesn’t hide it from me and I can see what I need. 8:41 – Panel: I love that about Vue. I knew this guy named, Hue. 8:54 – Guest: I have been friends with Sarah Drasner. 9:07 – Panel: Sarah is great she’s on my team. 9:39 – Guest: I had been diving into JavaScript over the summer. I hadn’t done a lot of JS in the past before the summer. I was learning Vanilla JavaScript. 10:21 – Guest: I don’t like how it mixes it all together (in reference to the JSX). 10:44 – Panel mentions Python and other things. Panelist asks a question. 10:54 – Guest: That would be a question for someone who writes that. 11:30 – Panel: I am going to change topics here for a second. Can you talk about your talk? And what is a design system? 11:48 – Guest answers the question. 13:26 – Panel follows-up with another question. 13:35 – Guest talks about component libraries. 15:30 – Chuck: Do people assume that the component that they have has all the accessibility baked-in b/c everything else does – and turns out it doesn’t? 15:48 – Guest answers. Guest: Hopefully it’s marked into the documentation. 16:25 – Panel. 16:36 – Guest: If you don’t document it – it doesn’t exist. 17:01 – Panel. 17:22 – Guest: “How do we sell clients on this?” We don’t – we let them come back and say, “we had to do less upkeep.” If they are following our patterns then... 17:57 – Panel: We’ve had where guides are handed off and it erodes slowly over time. Then people are doing it 10 different ways and not doing it the way it was designed. 18:31 – Guest: Yes, it should be baked-into the design and it shouldn’t be added to the style guide. 19:02 – Chuck: I really love Sass – and CSS – how do you write SASS or CSS with Vue? 19:12 – Guest answers the question. 19:23 – Chuck: You made my life better! 19:31 – Guest: If you have global files...you can have those imported among other things. 20:11 – Panel: What’s the best way to go about that? 20:24 – The guest talks about CSS, global designs, among other things. 21:15 – The guest mentions inverted triangles CSS! 22:12 – Guest: The deeper we get the narrower we get! 22:49 – Guest mentions scope styles. 23:12 – Panel: That makes total sense! We are using scope everywhere. 23:30 – Guest. 23:36 – Panel: How would you approach this? I start with scope and then I take them out of scope and then usually promote them to import for mix-ins. I wonder where is that border? 24:30 – Advertisement – Get A Coder Job! 25:09 – Guest answers the question. 25:53 – Panel: It sounds easy at first but when you are designing it you say: I know that isn’t right! 26:13 – Guest: I try to go through a design proposal. 26:27 – Guest defines the term: reused. 27:04 – Panel. 27:10 – Guest. 27:30 – Panel: We used to have this problem where we got the question of the following: splitting up the CSS bundles. 28:27 – Guest: That is the nice thing of having CSS in components. 28:49 – Panel asks Miriam a question. 29:02 – Guest: That’s often when someone wants a redesign. 29:54 – Panel: How do you decide on how many fonts to deliver so they don’t take over the size of the browser? 30:09 – Guest: The usual design rule is no more than 2-3 fonts works out well for performance. Try to keep that rule in mind, but you have to consider every unique project. What is more important for THAT project? 31:46 – Panel. 32:21 – Guest gives recommendations with fonts and font files. 33:37 – Chuck: What are you working on now with Vue? 33:45 – Guest answers the question. The guest talks about collaborative writing. 34:10 – Miriam continues. 34:55 – Chuck: What was the trickiest part? 35:00 – Guest answers the question. 36:03 – Guest: It’s called Vue Finder and it’s through open source. 36:39 – Chuck: Any recent talks coming up for you? 36:49 – Guest: I have one tonight and later one in California! 37:02 – Guest: There were several Vue conferences this year that I was sad to have missed. 37:40 – Guest: Are you doing it again? 37:49 – Panel: How many do you attend? 37:57 – Guest: Normally I do 8-10 conferences and then a variety of Meetups. 38:33 – Chuck: Picks! How do people find you? 38:41 – Guest: OddBird.net and Twitter! 38:58 – Advertisement – Fresh Books! DEVCHAT code. 30-day trial. Links: Vue React JavaScript C# C++ C++ Programming / Memory Management Angular Blazor JavaScript DevChat TV JSX VueConf US 2018 CSS Tricks – By Sarah Drasner Real Talk JavaScript FX Miriam’s Twitter Miriam’s Website OddBird Sponsors: Fresh Books Cache Fly Kendo UI Get A Coder Job! Picks: Joe Indoor Rock Climbing Getting back into what you enjoy RoboTech History of Robotech Vue.JS In Action John Papa How To Import a SASS file into every Vue Component in an App Real Talk JS Podcast Erik AWS Amplify Doctor Who Charles Dungeons and Dragons Stuff Extreme Ownership Miriam Pose New DND Game - Test Version

Panel: Joe Eames John Papa Erik Hatchett Charles Max Wood Special Guest: Miriam Suzanne In this episode, the panel talks with Miriam Suzanne who is an author, performer, musician, designer, and web developer who works with OddBird, Teacup, Gorilla, Grapefruit Lab, and CSS Tricks. She’s the author of Riding SideSaddle and the Post-Obsolete Book, co-author of Jump Start Sass, and creator of the Susy and True Open-Source toolkits. The panel and the guest talk about Fonts! Show Topics: 0:00 – Advertisement – Kendo UI 0:53 – Guest: Hello! 1:01 – Guest: I am a designer and a developer and started a business with my brother. We are two college dropouts. 2:00 – Panel: Is that’s why it’s called OddBird? 2:05 – Guest: Started with Vue and have been talking at conferences. 2:31 – Chuck: Chris invited you and he’s not here today – go figure! 2:47 – Panel: You are big in the CSS world. 2:58 – Guest: That’s where I’ve made my name. I made a grid system that was popular at one moment in time. 3:17 – Panel. 3:27 – Panel: Grid Systems are... 3:36 – Guest talks about her grid system and how it looked. 4:20 – Panel. 4:24 – Panel goes back-and-forth! 5:24 – Chuck. 5:27 – Guest: That’s why grid systems came out in the first place b/c layout was such a nightmare. When I built Susy... 6:02 – How much easier is design today on modern browsers compared to ten years ago when you created Susy? 6:14 – Guest: It can look daunting but there are great guides out there! 7:04 – Panel asks a question. 7:11 – Guest: We recommend a stack to our clients. We had been using backbone Marinette for a while and we wanted to start messing with others. Looking at other frameworks. Looking at design, I like that Vue doesn’t hide it from me and I can see what I need. 8:41 – Panel: I love that about Vue. I knew this guy named, Hue. 8:54 – Guest: I have been friends with Sarah Drasner. 9:07 – Panel: Sarah is great she’s on my team. 9:39 – Guest: I had been diving into JavaScript over the summer. I hadn’t done a lot of JS in the past before the summer. I was learning Vanilla JavaScript. 10:21 – Guest: I don’t like how it mixes it all together (in reference to the JSX). 10:44 – Panel mentions Python and other things. Panelist asks a question. 10:54 – Guest: That would be a question for someone who writes that. 11:30 – Panel: I am going to change topics here for a second. Can you talk about your talk? And what is a design system? 11:48 – Guest answers the question. 13:26 – Panel follows-up with another question. 13:35 – Guest talks about component libraries. 15:30 – Chuck: Do people assume that the component that they have has all the accessibility baked-in b/c everything else does – and turns out it doesn’t? 15:48 – Guest answers. Guest: Hopefully it’s marked into the documentation. 16:25 – Panel. 16:36 – Guest: If you don’t document it – it doesn’t exist. 17:01 – Panel. 17:22 – Guest: “How do we sell clients on this?” We don’t – we let them come back and say, “we had to do less upkeep.” If they are following our patterns then... 17:57 – Panel: We’ve had where guides are handed off and it erodes slowly over time. Then people are doing it 10 different ways and not doing it the way it was designed. 18:31 – Guest: Yes, it should be baked-into the design and it shouldn’t be added to the style guide. 19:02 – Chuck: I really love Sass – and CSS – how do you write SASS or CSS with Vue? 19:12 – Guest answers the question. 19:23 – Chuck: You made my life better! 19:31 – Guest: If you have global files...you can have those imported among other things. 20:11 – Panel: What’s the best way to go about that? 20:24 – The guest talks about CSS, global designs, among other things. 21:15 – The guest mentions inverted triangles CSS! 22:12 – Guest: The deeper we get the narrower we get! 22:49 – Guest mentions scope styles. 23:12 – Panel: That makes total sense! We are using scope everywhere. 23:30 – Guest. 23:36 – Panel: How would you approach this? I start with scope and then I take them out of scope and then usually promote them to import for mix-ins. I wonder where is that border? 24:30 – Advertisement – Get A Coder Job! 25:09 – Guest answers the question. 25:53 – Panel: It sounds easy at first but when you are designing it you say: I know that isn’t right! 26:13 – Guest: I try to go through a design proposal. 26:27 – Guest defines the term: reused. 27:04 – Panel. 27:10 – Guest. 27:30 – Panel: We used to have this problem where we got the question of the following: splitting up the CSS bundles. 28:27 – Guest: That is the nice thing of having CSS in components. 28:49 – Panel asks Miriam a question. 29:02 – Guest: That’s often when someone wants a redesign. 29:54 – Panel: How do you decide on how many fonts to deliver so they don’t take over the size of the browser? 30:09 – Guest: The usual design rule is no more than 2-3 fonts works out well for performance. Try to keep that rule in mind, but you have to consider every unique project. What is more important for THAT project? 31:46 – Panel. 32:21 – Guest gives recommendations with fonts and font files. 33:37 – Chuck: What are you working on now with Vue? 33:45 – Guest answers the question. The guest talks about collaborative writing. 34:10 – Miriam continues. 34:55 – Chuck: What was the trickiest part? 35:00 – Guest answers the question. 36:03 – Guest: It’s called Vue Finder and it’s through open source. 36:39 – Chuck: Any recent talks coming up for you? 36:49 – Guest: I have one tonight and later one in California! 37:02 – Guest: There were several Vue conferences this year that I was sad to have missed. 37:40 – Guest: Are you doing it again? 37:49 – Panel: How many do you attend? 37:57 – Guest: Normally I do 8-10 conferences and then a variety of Meetups. 38:33 – Chuck: Picks! How do people find you? 38:41 – Guest: OddBird.net and Twitter! 38:58 – Advertisement – Fresh Books! DEVCHAT code. 30-day trial. Links: Vue React JavaScript C# C++ C++ Programming / Memory Management Angular Blazor JavaScript DevChat TV JSX VueConf US 2018 CSS Tricks – By Sarah Drasner Real Talk JavaScript FX Miriam’s Twitter Miriam’s Website OddBird Sponsors: Fresh Books Cache Fly Kendo UI Get A Coder Job! Picks: Joe Indoor Rock Climbing Getting back into what you enjoy RoboTech History of Robotech Vue.JS In Action John Papa How To Import a SASS file into every Vue Component in an App Real Talk JS Podcast Erik AWS Amplify Doctor Who Charles Dungeons and Dragons Stuff Extreme Ownership Miriam Pose New DND Game - Test Version

This week Scott and Wes are live at JAMstack_conf with games, Spicy JAM Tips, Q&As 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/syntaxfor more info. Show Notes 7:14 - Spicy JAM Tips Set default headers in your request library - this way it comes along for the ride on every request Don’t get hung up on “static” - static sites can be as dynamic as needed Don’t wait to use new tech - progressively enhance and gracefully degrade where needed There are many JAMStack libraries in the sea - there are many different approaches so don’t be afraid to experiment Side projects are key to learning - test out new tech on smaller projects first and get comfortable with it 10:10 - This, That or Both? Evo RX - High end Carbon Fibre Road Bike or Library for composing asynchronous and event-based operations in JavaScript? Jumpsuit - A rap/rock group from Flint Michigan or a minimal React/Redux Framework? Aphrodite - React Styling Library or Best Selling Erotic novel? Yugo - A minimal static site generator built in O-CAML or a super mini hatchback built in the former Yugoslavia? C-Control - A modern state management library for web components or studio headphone mixer? Yakbak - A recordable HTTP testing interface or a popular 90’s electronic toy? Joose - A hip east coast juice bar or a metaobject system for JavaScript? Easy Rooter - A client side object oriented router written in modern Vanilla JavaScript or a drain cleaning plumbing apparatus popular among local plumbers? Aqueduct - A server-rendered ORM and oAuth 2.0 based framework built in Dart or a early 2000’s pop group hailing from Venice Beach? Gort - A 1980’s animated series cartoon villain or a CLI Toolkit for RobotOps written in Go? Raptorize - A jQuery plugin that plays a Velociraptor screech or A popular DIY spray on truck bed liner? 21:13 - Stumped! Question 1: What does “age” console.log to and why? let age = 26; age /= 2; console.log(age); // ?? Question 2: What are all seven types in JS? Question 3: How do you pronounce “specificity”? Question 4: What is event delegation and when might you want to use it? Question 5: What is CSS @supports for? Question 6: An arrow function takes in an unlimited number of arguments - how would you capture them? Question 7: What is the difference between .slice() and .splice()? Question 8: How would you calculate the number of milliseconds since midnight of January 1, 1970? Question 9: What does “age” console.log to and why? const age = console.log(100) || 200; console.log(age); 31:26 - Overrated or Underrated? Arrow Functions Downtown scooters Using Sass inside Styled Components Website that play sound in the interface The amount of JS frameworks Soft close toilet seats GraphQL ES6 Destructuring Instapots Implicit Return CSS Houdini Service Workers and Offline Applications Modern Design Tools - Figma, FramerX, Moudlez, Sketch, Studio Decorators Optional Chaining Proposal 42:35 - Q+A with Scott and Wes Since this is your first time meeting, what was the thing that surprised you the most? If you could create any Tycoon game, what would you create? In 2018, how concerned should we be about no-JS users? How many spaces should a tab be? How important is integration testing and the decentralized ecosystem? What are your thoughts on the new React Hooks API? Are we going to have a serverless function architecture apocalypse? Are you ever going to create an online course together? How will the future look for component-based design? What’s your least favorite jam? What would be your goto headless CMS? What do you disagree on? Shameless Plugs Scott’s Level Up Pro Subscription Wes’ Advanced React 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

In this episode (9) of the Mr Frontend Podcast, we are gonna talk about: "How to spice up your technical skills during the end of 2017 holidays!" NEW INTRO By Hyde - Free Instrumentals: https://soundcloud.com/davidhydemusic/piano-rock-instrumental WHY? - Build something cool or fun you enjoy while you set the requirements - You can learn something new! - Pick the Framework or Library you always wanted to learn or do it with Vanilla JavaScript! INSPIRATION - Build a Netflix clone with The MovieDB (https://www.themoviedb.org) - Build a weather app with the Weather API (https://openweathermap.org/api) - Build a blog with the WordPress JSON API, you may use the Mr Frontend WordPress API (http://blog.mrfrontend.org/wp-json/wp/v2/posts/) - Build a blog with the Medium API (https://github.com/Medium/medium-api-docs#33-posts) - Search your favorite Artist with the Spotify Search API (https://developer.spotify.com/web-api/search-item/) - Build a User management system with the Random User API (https://randomuser.me) - Create custom QR codes with the QR Code Generator API (http://goqr.me/api/) - Build a wallpaper app with the Unsplash API (https://unsplash.com/developers) SEARCHING FOR COOL APIS? Check: https://github.com/toddmotto/public-apis Let me know what you build with it during the holidays! Next week is the last episode of 2017! Then we take some time off and get ready for an energizing 2018 full of new stuff! If you like it like and share the podcast! And don’t forget to subscribe!! See you next week!!

Every JavaScript developer is faced with the symptoms of framework fatigue. In this Episode, we discuss various frameworks and their approaches and compare against just using VanillaJS. We discuss angular, ember, react and various Vanilla TypeScript libs that Nikos has written: https://github.com/quantumjs/warp-router https://github.com/quantumjs/solar-popup https://github.com/quantumjs/vanilla-typescript Also we talk about the super tutorial: https://serverless-stack.com for learning Serverless and Nikos upcoming webinar @ http://www.esynergy-solutions.co.uk/event/introduction-typescript-and-aws-lambda-functions

Julie Moronuki: @argumatronic | argumatronic.com Show Notes: 00:57 - Julie's Unique Origin Story Into Programming 03:47 - Good Resources vs Bad Resources for Learning Haskell 11:18 - Areas to Look at Before Taking on Haskell and Functional Programming 15:56 - Terminology 17:50 - The Haskell Pyramid 25:51 - Learning Haskell Vocabulary 28:20 - Monoid and Functor 42:06 - Advice for Someone Who May Not Be Interested in Programming Resources: Haskell Programming From First Principles (Haskell Book) Natural Language Processing (NLP) Learn You a Haskell for Great Good! Programming in Haskell by Graham Hutton Haskell: The Craft of Functional Programming by Simon Thompson Real World Haskell by Bryan O'Sullivan, John Goerzen, and Don Stewart Introduction to Functional Programming Course with Eric Meijer The Joy of Haskell Haskell eXchange 2017 - A Monoid For All Seasons Transcript: CHARLES: Hello everybody and welcome to The Frontside Podcast, Episode 83. My name is Charles Lowell, a developer here at the Frontside and your podcast host-in-training. With me today on the podcast is Elrick also. Hello Elrick. ELRICK: Hello. How you doing? CHARLES: I'm doing well. I'm glad to have you on this one. I'm glad to be doing this podcast in general. We have someone on the podcast today who I've been following for, I guess probably about two years because she published a book that has been very, very helpful to me. It's one that I recommend to a lot of people. It is learning Haskell from first principles. With us on the show is Julie Moronuki, who is co-author of that book. Thank you so much, Julie for coming. JULIE: Yes, hi! Happy to be here. It's nice to finally get to talk to you. CHARLES: Yeah. One of the reasons I wanted to have you on the podcast was because I feel as though you have one of the most unique origin stories because of programming and entering in the tech world. Most of us are curious, we either come from video games or maybe we just start fiddling with the web browser. You enter the maze from the entrance that is like hidden from all, I would say. You went straight to writing a book on Haskell, is that --? JULIE: That is what happened. In 2014 on Twitter, I met my co-author, Chris Allen and he has been trying to figure out better ways to teach people Haskell because the on-ramping, I guess of people to Haskell can be quite difficult. The materials that exist are not always accessible and people felt like they need the advanced math degrees before they can write Haskell. He was trying to figure out better ways to introduce people to it. Since I was this person who's never programmed before -- I have no background -- and then he thought, "This will be a very different experience, trying to teach Haskell to her." Because I have a linguistics background and stuff he thought, "That would be interesting too and maybe, she'd be interested eventually in doing NLP." I said, I'm not -- CHARLES: What's that? Acronym alert. JULIE: Oh, yeah. Sorry. Natural Language Processing. I said, "You know, I've never done any programming and I don't play video games and I never have had any desire to learn computer programming. I don't think I'm going to like this. I don't think this is going to last but sure, I will try," and so I did a little bit. I read a little bit of 'Learn You a Haskell for Great Good.' I've read some other things. CHARLES: This was before you guys had the idea of actually writing a book. JULIE: Yes. He had the idea of turning some of his thoughts about teaching Haskell into a book and as he would explain things to me, like the questions I had about 'Learn You a Haskell,' I'd be like, "We should write this down," and he would say, "It's so hard to write it though. It's easy when I'm explaining it to you and it's so hard to write it." Initially, it started that I was helping him at things that he was teaching me and then as we got further into the book and I started reading a lot of other Haskell stuff on my own and figuring stuff out, I was writing more and more of it. Then we were kind of equal co-authors after not too long. That's how it happened. I really didn't think that I would stick with Haskell or with programming. I'm still sometimes I'm not sure about programming. I'm not sure about this whole making software thing. But Haskell is so interesting to me that I'm still here. CHARLES: That is fantastic and it's a great story. I'm curious, when you were doing the proto-research to learning Haskell, coming from really truly first principles and having no experience of programming, what made a good resource versus a bad resource? What are the things that you gravitated towards and say, "This is really instructive." What was the tone there? JULIE: One of the major problems ahead of most of the Haskell resources that exist is they assume that you've done programming before because nobody learns Haskell as a first language so they all assume that you have done some programming before. They would make references to things that if you were a programmer, you would know what they meant but I didn't. That was one of the hardest things for me. Even 'Learn You a Haskell' does that to some extent. CHARLES: What's an example of that? JULIE: I had learned a little bit about recursion from linguistics because that's a thing in human language so I really understood recursion but most of the Haskell resources explain it to you primarily in terms of, "This will be like your loops in other languages." I'm going to be like, "I don't know what a loop is. This isn't helpful for me." There are a lot of things that I didn't understand so when people talk about Haskell as being a pure functional language, neither pure nor functional necessarily, I didn't have anything to contrast them with so they didn't necessarily make sense to me as things that make Haskell different from other languages. I didn't know what imperative programming was and people would say, "In contrast to imperative programming, functional programming does this," and I'd be like, "Okay, but I don't understand what the imperative programming way is so this contrast isn't making any sense to me and same thing with purity." There were a lot of things I had to learn, in fact about mutable state because I didn't know anything about it. I had some understanding of how computer memory works but still some of the ways that people talk about it were not obvious to me. CHARLES: Do you find that seeking out that contrast actually wasn't helpful? Is it noise since at least at the beginning, it's something you'll never do. It's like saying, "Over in France, they wear these kind of socks." Since I'm going out into the street in front of my house, I don't really care. JULIE: Right. In the beginning, it was a lot of noise and I understand why they do that because they are making the assumption that everybody who is learning Haskell has come from some other programming language, probably an imperative one so I understand why that happens but in the beginning, it was very much noise for me. I noticed a lot of Haskell resources, one of the first things they tell you is that in Haskell you can't do 'x = x + 1'. I was like, "If I'm reading this like it's mathematics, why would I think I could do that." If you come from a different programming language, you might well think that you can do that but in Haskell, we can't so making that contrast, when I didn't have that background was really just confusing for me. Now, because I teach people and most of them do have some background in an imperative language, understanding the contrast is more helpful to me but in the beginning it was just confusing and noise. When we wrote Haskell book, we tried not to make those kinds of references and like, "Let's assume that everybody is just like Julie, doesn't know a different programming language that we can contrast it with and let's try to write a book like that." CHARLES: Right. I think that's a key insight because some people would say there's a lot missing or that difference might stand out. Now, that you pointed out, I can see it but I don't think I noticed it while I was reading it. But one of the things that I like is because I also tried to learn Haskell through 'Learn You a Haskell,' and I didn't find it very helpful. I found it entertaining and it's not a knock against the authors. Some of the sketches were really cute but it was still more explaining... I don't know. It was explaining more of the how, than the why, if that makes any sense where I felt as though in your book, there were a lot more analogies to actual human experiences, using the visceral language saying, "A mono is something you can mash together or squeezed together." That really connected for me. Whereas, explaining it in terms of concatenation and laws and stuff like that. Those things seem cited to the secondary resources to the primary resource. JULIE: Yeah. I think that's kind of helpful for me too. There are different Haskell books that have, I think different things about them that are good. I forget the name of the book but Graham Hutton's book, the way he talks about recursion was really helpful to me. The way he explains recursion and of course, folds but folds are things that he's known for so those parts of that book are helpful for me. But really the best book other than my own of course, for me is Simon Thompson's. I think it's called ‘The Craft of Functional Programming' and I think it does better at explaining things just in terms of Haskell. Real World Haskell, I guess is really good. It was harder for me because I hadn't been a programmer before. I think it's got so many practical exercises that -- CHARLES: Was that the O'Reilly book by Irish gentleman whose name eludes me? JULIE: Yes, Brian O'Sullivan. It makes more sense to me now but there were things in it that are sort of programmer things. Because I'd never made software before, that were really confusing for me. But Simon Thompson's, because his book does have exercises and they were ones that I could understand and do. They were fairly self-contained. My first experience actually in writing a program that does IO was from his book and I was just so thrilled. I was like, "I got it. I did it." That was really helpful book for me but I don't see people recommend that one as often but that was probably the best one for me. CHARLES: Yeah, it's always a balance because the Real World Haskell didn't really worked for me, almost because the examples were too pragmatic or too complex and I picked this up when I was 10 years into my programming career and I struggled to follow the JSON parser example, which is parsing JSON is something that I've actually done several times in multiple languages and I still struggled with it. JULIE: Whereas for me, I don't even know what JSON is. This is not something I've ever dealt with. I know what it is now sort of, but it's still not something that I deal with very much. I was just like, "What is this? I don't even know what to do here." It wasn't quite as helpful for me. I've heard a lot of people have success with that one but I think they don't share quite the same richness of programming experience with Brian O'Sullivan. I think it's a little bit more difficult. ELRICK: These are a lot of amazing resources that I wish I knew about when I try to learn Haskell. I took an online course with, I think it's like Eric Meijer and that class was very intense. Looking back, what would you say are some areas that someone should, either start to look into before they step into the Haskell world, being that you didn't come from a programming background but connecting to dots backwards now? What would you say are some areas that people can slowly ramp up into to get into Haskell and functional programming? JULIE: When I teach people Haskell, the people who have the easiest time are people who have been writing Scala for a while and they've moved over to the FP in Scala side. When I first started Haskell, I heard a lot of people make jokes about how Scala is a gateway drug to Haskell. I think there's actually might be so truth in that because I certainly have a lot of students that were Java programmers, then they got interested in Scala because maybe Scala is better for some things than Java and then they start moving more and more over to the FP in Scala side. Those are probably the students that have, I think the easiest time making the transition to Haskell that I've had anyway. But you know, I think even JavaScript, trying to write in a more functional style and there are some resources for that and really, there's a very good tutorial about monads that uses all the code examples in JavaScript. I think a lot of the concepts that you can start to approach them from other languages. Haskell is still going to be weird in a lot of ways and another thing that works for a lot of people is going to Elm. Elm is similar to Haskell but different. I think that that has worked also for a lot of people getting them into understanding more functional programming concepts but with the much easier... The word easy is so -- ELRICK: It's like a relative term like, "Oh, this is easy." JULIE: It is. CHARLES: Easy to say, right. ELRICK: That's what I thought when I step into learning Haskell and functional programming. I was like, "How bad could it be?" JULIE: Right. Learning Haskell can be very bad. I'm not going to kid around about that. It's a shame because I don't think that it needs to be that bad but the way it's presented oftentimes, for various reasons, I think why Haskell gets presented the way it does but I don't think it needs to have it like that. The designer of Elm, whose name I'm not going to try to pronounce because I don't know how you say his last name, he really made an effort to for example, the error messages in Haskell can be very intimidating. The situation there has improved since I started learning Haskell but they can be quite intimidating and he really made an effort to make very friendly error messages, very helpful error messages. I think that it shows and then it makes a difference for people who are learning. If you start with Elm and then you do want to see what Haskell or PureScript, which is also frontend language, mostly. It compose of JavaScript but it's very Haskell-like, then from Elm, let's see if we can get a little more hardcore Haskell. I think the transition to Haskell or PureScript is easier from there. I think it does help to move in the functional direction from whatever language you're in, if you do FP in Scala or try moving to more functional JavaScript or even Elm. Then Haskell will make it more sense from there or be a little easier to approach. CHARLES: Yeah, and I definitely think that for, at least from my perspective, I've been able to take a lot of those concepts that I've learned from Haskell and then apply them, even inside Vanilla JavaScript. There are things that have become indispensable like mapping and folding and they exist in JavaScript. You can reduce arrays, which is a similar to a fold and then you can map arrays but understanding that map, the key insight for me that I got from learning Haskell is that there's a whole class of values that you can map, not just arrays. The standard JavaScript object is essentially a Functor and will get a little bit to that because for people listening what that word even means and the meta around the fact that they're all these weird words and how do I go about something I want to ask you about. But the trees can be mapped and the objects can be mapped and all of the sudden, it's like this one concept that I use so much for lists, it's available on all these different data structures and it's get me thinking like, "What other data structures can I use this operation? What are the things are Functors that I'm working with?" Really, it's changed my perspective to think about the type of the data structure, in terms of the operations. JULIE: I'm in favor of keeping the terminology that we have but just explaining it much better. That's the approach that I take but it can be very hard, especially it was your first learning Haskell. I don't know if you've seen the Haskell pyramid but to get sort of productive where you can write programs in Haskell is not a very high bar. It feels like it is when you first start but it's not really very high bar but Haskell just keeps growing and growing and getting deeper and deeper so you're always approaching new libraries that you've never seen before and you feel then you've been learning Haskell all over again because they're written in a very different style of Haskell or they have even more terminology, even more kinds of Functors that you've never heard of before or something like that so you're always approaching these things over again. It can be a very intimidating feeling and it makes a lot of people very uncomfortable and I'd say, if you like Haskell and that does make you feel uncomfortable, then you don't actually need to do that because a lot of people write Haskell very happily every day in their jobs even and don't do that. They don't mess with some of the newer, super cool libraries that have all this funky terminology and stuff. Some of them don't mess with them at all. CHARLES: But certainly, there is some concepts that are core. I'm thinking of like applicative and Functor and all these things that I'm learning about and I'm curious to hear about your experience as you climb that pyramid. What is the pyramid entailed? First of all, I'd love to hear more about it because this is actually the first time I heard about the Haskell pyramid. JULIE: Say you understand monads, then you can write really a lot of Haskell programs. Probably at some point, you will need to understand monads transformers but if you just get to the point where you understand monads pretty decently, you can write a lot of software so after that, then learning more is maybe going to improve your Haskell, maybe let you write some things that you couldn't write before but a lot of it above, not that these things are necessarily in an hierarchical progression. We cover monad transformers in a fair bit of detail in Haskell book but if you get anything beyond what's in Haskell book, one of those things that some of them are very interesting, some of them can make you much more productive but some of them are also people do them for fun to explore the space and some people love them and some people hate them. Haskell lets you do a lot of things for fun and exploring mathematics in ways that are interesting and exciting and may influence and in fact, have influenced other languages like [inaudible] in PureScript but not really necessary for basic Haskell programming. A nice thing happened while we're writing Haskell book. I was writing, I think it's chapter six, which is about type classes. I was writing that chapter and at the same time, my co-author had started writing the Monoid chapter. The type classes chapter comes in chapter six and we introduce a lot of the basic type classes: num and eq and some of those in that chapter because I do think it's important. Type classes are very special thing about Haskell so I think it's important to, at least start coming to groups at them early. Some people disagree with me about that and think they can ignore them for much longer. But at any rate, it is where it is and I felt that that was important. Maybe the real motivation for type classes, really until we started writing the Monoid chapter so he started writing that while I was working on type classes chapter and he sent me the beginnings of the Monoid chapter to look at. At first I thought, "We've got addition and multiplication and list concatenation and this just doesn't seem interesting. What is this generalization of a Monoid that I'm supposed to get from these three things? And why bother making it a type class," because additional and multiplication are already in the num type class and then list concatenation is just for list so why make this into a type class and what's that motivation there. With eq, we want a quality -- CHARLES: Is that how you pronounce 'eq?' JULIE: That's how I pronounce it because 'equal' or equality. CHARLES: Okay, so this is a type class for doing what? Making sure to being able to compare two values on the same value. JULIE: Yes and it's a weird one because for most data types, you can have an eq instance and you want probably, in a lot of cases to have that but we don't want because function is a data type in Haskell so you don't want to have an eq instance for functions and that's why equality is not implemented generally for everything. That's why it's a type class so there's no instance for functions because that's not decidable. You can't decide if two functions are equal, generally. Some functions you can but in the general terms, for datatype, you can't. CHARLES: That's actually a pretty profound statement. Proof of which is left as an exercise for the listener. JULIE: We got to the Monoid and I was like, "What is the [inaudible]," or something. It turns out that there are Monoids everywhere. There's all kinds of things that you want to, either concatenate or make a product of. Then having this as a type class and thinking of it in terms of like, "We've got this abstraction. We've got this category. We've got this algebraic structure. Now, we can look for in all these other places," because once you've named the thing, then you can talk about it and think about it in a little bit of the different way. It's like, "Now, we've got this group of addition, multiplication, list concatenation." Now, we've got an abstraction of that and we can think, "Where else can I see this pattern?" and it turns out it's all over the place. For me, that was one of our thought like, "Type classes are actually really cool and powerful and interesting thing." For me, that was when it seemed like, "The terminology is worth it because, now I want to think about finding these algebraic structures and in all these other places." CHARLES: Right and like a Monoid, it could essentially be called, if you're using a Java interface, like 'mashable togetherable' or 'concatenatable' or something like that. But there's a kind of one-to-one correspondence but it is a vocabulary that just needs to be learned. JULIE: I don't know much about category theory or anything but the other cool thing about Monoid for me was that there are almost always two because there's almost always one that's destructive or additive or concatenative and there's almost always one that is conjunctive or a product or multiplicative. It's often across product that would be the zipless Monoid that exist in base and it's a cross product of the two lists. There's almost always two, whereas when you think of Monoids in the very abstract looking category theory, it doesn't matter if it's addition or multiplication. The operation doesn't matter, whether it's addition or multiplication or concatenation or cross product because you generalize the actual operation to the extent where what it's going to produce. It doesn't matter anymore. For me, I still think of Monoids in terms of like set theory or Boolean Algebra, then that's one of the things that I think is difficult with Haskell where people talk about Monoids in terms of category theory but I think that's not very helpful for the actual programmer who has to actually deal with the two different instances like sum and products or concatenation and zipping are going to actually act different in a program. CHARLES: Right, they're going to yield a different set of values. JULIE: Yes. CHARLES: Is there a baseline vocabulary? I kind of think of it like learning a new language, right? JULIE: Yep. CHARLES: When you're learning Haskell, you're not just learning a new language. You're literally learning a new language. I could go and I could learn Japanese but it's going to be a struggle at some point. People say certain languages are hard and certain language are easy. I don't generally subscribe to that. I think that most of it is just going about and living in a place where they speak this language and you'll absorb it and it's the decision to go and live there -- that's kind of the primary one. But let's say, you're a foreigner and you're travelling to this country called Haskell that's got this strange language. Like other human languages, it's just got different names associated with different concepts and some of the concepts might even just be unique to that country. Just like when you're travelling and acquiring a human language, there's a certain level of vocabulary that you need to achieve before you can do things like buy groceries and be able to transact financial exchanges or have a conversation about the weather. What are the kind of the levels of vocabulary that you need to acquire to be operational in Haskell or I would say, even in functional programming because now that I've been exposed to this, I see it in Clojure. I actually see people doing this JavaScript and in Erlang, in Elixir and what have you. JULIE: Yeah, I don't really know how to answer this question. How to buy groceries in Haskell? CHARLES: Let me let scale that down because I had this horrible tendency to spend five minutes asking what I say is going to be single question but it's actually like 30. Let's take down the scope. When you were learning this vocabulary, at what point did you feel like you're really gaining traction? We're you really starting to connect the dots? JULIE: For me, I think when I got through Functor. It was when I felt like -- CHARLES: Functor and what comes before Functor? JULIE: Monoid. I think once you understand Monoid and Functor, then a lot of other concepts in Haskell will start falling into place because this is not obvious to everyone but I think once you really understand Monoid and once you really understand Functor, then applicatives are monoidal Functors and that's not obvious to everyone. Like I said, it's not obvious at first certainly, and monads have characteristics of both Monoid and Functor as well. Then you start saying, "There's all these other Functors. There's profunctors and bifunctors. I think once you really understand Monoid and Functor, a lot of the rest of Haskell starts falling into place and then type classes like alternative. Alternative is another kind of Monoid. We have all these other names that if you can see the general pattern of Monoids and Functors, I think to me anyway, a lot of it then just started falling into place. Applicatives to me seemed, I don't want to say obvious or simple but in traverse, it's same sort of thing so we have these other names for it -- traversable -- and I was like, "Why was it called traverse. I don't understand this word at all." But once I saw the type signature and what actually happens with what the function traverse does, I was like, "Okay, I see what's happening here." For me, those were the two big hills. Once I got through Monoid and Functor and really understood them well, then a lot of other stuff just come and fell into place for me. ELRICK: This is really interesting. How was a Monoid explained to you when you were first starting to learn Haskell? Then now, how do you explain what a Monoid is to someone that's learning Haskell? JULIE: When Monoid was first explained to me, it was the pattern of there's addition and multiplication and list concatenation so it generalize out that pattern and that was really hard for me to understand at first because list concatenation and addition are similar but multiplication is different. I was like, "What do these three things have in common?" What they have in common is that they take two values of a certain type and return another value of that type and that's the type signature of the main function, that's in the Monoid type class. But that doesn't really tell you very much. A lot of functions could do that, in theory at least. How you combine them is really what's interesting about Monoid and also what makes concatenation and addition different from multiplication. Fortunately in college, I had had a fair bit of exposure to Boolean Algebra so figuring out that like, "There's actually two basic genres or varieties of Monoid and they are disjunctive or additive or they are conjunctive or multiplicative," and figuring that out, to me I always think that Monoid should really be, maybe two different type classes, one for the additive Monoid like list concatenation and addition and things where you are adding two things like a set union. Then conjunctive, which would be this intersections or multiplication or cross products. I always think there's maybe should be two different type classes but there's not a good way to do that really in Haskell. Instead, we have this one type class and then we do this ugly business of wrapping them in different type names. CHARLES: Is that why you'll have a constructor for some so it's just a wrapper for an integer? JULIE: Yeah. CHARLES: I don't know if that's so bad. JULIE: I don't like it but -- CHARLES: Yeah. You know what? You do a lot more than I do so I'm going to take your word for it. JULIE: Yeah, that's exactly why. Sum and product are the wrappers for integers because integer doesn't have a Monoid. It has two Monoids over it. CHARLES: I see. There's lots of ways to combine integers. JULIE: Yeah and those are the two basic ones. Then because Monoids also have an identity so with semi-groups, then you get even more semi-groups for integers because you get max and min, because they don't have an identity so there's semi-groups. CHARLES: There's always risk getting down into the weeds with the vocabulary but I think that there's a message here because your answer to the question is really, "When I understood Monoid and I understood Functor," from that point on, the overhead that you had to expend to get other things was lower than the overhead that you had to expend to get those initial two things. For anyone listening, Monoid and Functor are probably opaque terms. You have no idea what the hell they mean. We've been talking about in things like that a little bit but then it's okay because they're a finite set of opaque terms and they're very achievable and once you can achieve those, then you've done 90% of the work and now, you're just combining them into interesting and novel ways. JULIE: Yes. I will say it that a lot of people do tell us about Haskell book that applicative is actually the hardest chapter in the book, not monad but applicative. CHARLES: Really? JULIE: Yeah. A lot of people do tell us that. Because that's the first time that you've taken the concept of Monoid and the concept of Functor and combining them into a new thing so then, once you've done that with applicative, then after that, really it's all downhill. CHARLES: Right. It seems like there's a couple of key insights. As you're climbing that hill, I like that analogy is like one, just understanding that there things like type classes so you've through attacking Monoid and through attacking Functor, you realize, "There is such a thing." By recognizing there is such a thing as a Functor, you recognize that there is the potential for other type classes like it. Then through combining it with Monoid, to get applicative, you can see, "I can actually compose these things into new instances of those things," and then that's either the crest of the hill or the Pandora's box, depending on which way you look at it. I think there's a hopeful message in there that if you can invest the time to learn these opaque terms and making them transparent to you, you can really, really, really lean heavily on that knowledge in going forward. JULIE: Yeah. I'm writing a new book now called 'The Joy of Haskell.' The idea of The Joy of Haskell is meant to be an intermediate book. For people who already know some Haskell but we want to make words like Functor more general, like in Haskell book we really focused on the type class called Functor when it's actually a concept from mathematics or actually originally from linguistics oddly enough but we really focused on the type class in there, rather than trying to explain what a Functors are generally. In the new book, in The Joy of Haskell, we're going to try to take a lot of these terms like Monoids and Functors and catamorphisms and all these other words that Haskell has used all the time and try to explain them generally. Then also give examples like interesting uses from different libraries and stuff like that. It'll service both, hopefully a guide to the vocabulary of the Haskell ecosystem and also some documentation and examples for libraries and things like that that are useful because these things do have uses. They do get used in interesting and exciting or terrifying -- maybe those are related -- ways. That's the goal of the new book is to try to make a guide to all of this vocabulary that Haskell use all the time. We're trying to do that. How do I explain Monoids, you asked. You've got two values of whatever type. It doesn't matter the type and in general, there would be two ways you can think of to combine them, either making a sum or a union of all the values in them or making some product of those values, if they contain multiple values or even if they only contain one. That's how I explain them now. I'm not certain that addition and multiplication are actually the best ways to start with that because addition and multiplication don't act quite like set union and intersection do. I'm actually thinking of them in terms of and this is how I explain monoids to the people now, I start from set theory and that sounds really heavy but it doesn't have to be because I think a lot of things about sets are -- CHARLES: They're very intuitive, especially if you have visuals. JULIE: They're very intuitive, for people to think about. Yes, exactly. I explain Monoid now more in terms of set union and intersection. I'm actually giving a talk in October. It's coming up in just a couple weeks at Haskell eXchange in October 12th and 13th in London and I'm giving a talk there called 'A Monoid For All Seasons' and I'm going to try to explain the theoretic motivation for Monoids and try to explain them in those terms. Semi-group is a little bit different because lacks the identity but I'll try to explain the alternative type class and monad plus this really the same thing as alternative. These things are also just Monoids so we have these different names because it's a different type class alternative but it's really just another kind of Monoid. I'm giving that talk about set theory in Monoids in October, in a couple of weeks. People keep asking me on Twitter, "What's your obsession with Monoids," because my name on Twitter is Monoid Mary so I try to explain why I love them so much. CHARLES: Actually, it's an awesome point, which I've just gotten to experience it is what you see like, "Oh, there are these abstract things," you start searching for them. A lot of times, you'll uncover them and it'd be a real timesaver. There's the thrill of unearthing it in the first place and then when you could say, "Now that I've identified this thing as a Monoid, there's so much less that I have to write." There's like less work that I have to do. It's the same reason that we write frameworks for ourselves in software. It's like, "We love Ruby on Rails because of all the work we don't have to do." Now, you have to expend a lot of energy to work with it, using Rails an example but there's lots of software frameworks. It's like, "If you can find a good persistence framework or you can find a good thing for making a library for handling HTTP requests and responses, why would you write it all by hand in the first place?" I think the thing that's exciting for me as a developer is being able to see, "Monoid is a thing. Functor is a thing and I can now actually use this and I can use it almost as a looking glass to explore the world around me. When I see something in the landscape that just leaps out through that lens is another great one." I've been on a big kick lately but being able to say, "This is going to save me so much time because of the thoughts that I don't have to think and the code that I don't have to write." I think connecting it back to the pragmatic, I certainly have become really obsessed, maybe not about Monoids but having a type class large in your mind. JULIE: I think it's a really powerful thing. Sometimes that jargon is really useful. It's useful in a sense that it like compresses a bunch of information into a single word to remember. It's like teaching my eight-year old multiplication and we were talking about like, "It's like addition," and for us adult, I'll just go ahead say, "It's associative and commutative," but showing him that you can do those things and that addition is like that too and we're talking about that and he was so excited to learn that there's this word 'commutative' that encapsulates this idea for both concepts so he doesn't have to think like, "Addition does this thing. Multiplication does this thing." He doesn't have to remember both of those things, like he just remembers, "Commutative and they're both like this." It kind of compresses that information and what you have to remember and think about. Then it does make it easier to see that pattern in other things, then we can find commutativity in other things because now we have this pattern that we can look for and we got a name for it. We can talk about it and really, there's a lot of stuff like that in Haskell where we find some pattern that we find useful or we want to be able to talk about or easily translate to a bunch of different types, not translate is quite the right word but you know what I mean, I think. Then we give it a name and we make type class for it and then it's, "Now, we find it even more place for us." CHARLES: Right. It's about thinking less, right? JULIE: Yeah. CHARLES: That's a big misconception is that it's not about thinking more, it's about thinking less. JULIE: It really is. I think it's because there's so much kind of upfront work, where you have to learn all this new stuff upfront, then people mistake that for how much work we're always doing but in Haskell it's like, "We did all this work upfront and now we're now we're not going to think about these things anymore." ELRICK: That sounds like a good title for a book, 'Learn Haskell and you will think less," but it's true. When I struggled through that online class, I came out of that just being able to pick up any functional programming language and just hit the ground running. It is definitely a plus and you will think less. JULIE: Yeah, in the long term, I think that you do. Haskell is not a perfect language. There are things that probably can be improved. CHARLES: Now, before we go, I wanted to ask you, having had this very unique on-ramp into programming, which apparently you're still not convinced about. I'm curious what it would take to actually convince you but the real question that I have is there any advice that you have for someone who does not have a stereotypical background in programming who may not think that they would find programming interesting, who might have any number of roadblocks in terms of their own conceptions about the path forward. What advice would you have for them? JULIE: I am a bit joking when I say that I'm still not sure about writing software. I don't feel like I'm good at it and I think this is really the key. There are a bunch of domains in programming that I don't personally care about. I don't want to make web apps and I have nothing but respect and admiration for people who do. To me, it's very, very hard. CHARLES: Mostly because our tools aren't the same. JULIE: Yeah and there's just so many things outside your own program, there are just so many things that you have to think about and deal with because there's the network and there's other people's computers and they might be doing in other people software and what it might be doing. It is insane so for me it's very hard. There's a lot of domains of programming that I don't care about and when I thought about programming, that's the kind of thing I would think about. I certainly knew a lot of people who are web developers or the common programming jobs, I guess. Some of them just weren't that appealing to me and I'm not interested in making games or graphics so those are the kinds of things that I thought about for programming. There are things though that I am interested in doing. I'm very interested in natural language processing and I guess that's related to machine learning. I've recently taken up an interest in things like the raft protocol, the consensus protocol. Those kinds of things interest me a lot and there's a lot of the theory that interests me. I'm reading a dissertation right now about implementing a non-strict lambda calculus, which is what Haskell is. It's a non-strict lambda calculus and this guy's dissertations are theoretically implementing a non-strict lambda calculus. To me, the theoretical side is really interesting but then I am also interested in certain kinds of software. For some reason, I have developed quite an interest in making Twitter bots. I think that the advice I would give -- I'm rambling a little bit -- to people who think they're not interested in programming so why should they learn or whatever, is just find the thing that you are interested in and there's probably a way you can make software for that and maybe that will be the thing that will get you interested. It might not be Haskell, maybe you are interested in making web apps, in which case I would say go for Elm or PureScript, obviously because I like functional programs but Haskell might not be the best first language for you in that case but find the thing that you're interested in and there probably is a way to write software to do that. There's probably something in programming that will interest you. It's such a vast field. CHARLES: All right. I really, really like that answer. ELRICK: Yeah, that's a beautiful advice. Find your domain. CHARLES: Yeah, it's bigger than you think. JULIE: It's much bigger than you think. CHARLES: And there is a place for you. Thank you so much for coming on the show, Julie. I really, really, really enjoyed our conversation. JULIE: Yes, so did I. This is a lot of fun. CHARLES: Thank you. Now, before we go, I understand that you are going to be in London, was it roughly very, very soon, you said you were giving a talk. JULIE: Yes, the 12th and 13th of October. It will be recorded for people who can't get in. It will be recorded, I believe. CHARLES: You will be talking on 'A Monoid For All Seasons.' JULIE: Yes. CHARLES: And then you've also got The Joy of Haskell book, which you're hacking away right now, right? JULIE: Yes. CHARLES: With that, thank you so much for both of you. Thank you all for listening. What's a good place for people to reach out for you? JULIE: If they're on Twitter, I'm very active on Twitter so I'm @argumatronic on Twitter and my blog is also Argumatronic and that has more contact information. CHARLES: Fantastic. We'll link to those in the show notes. For everybody else, thank you for listening. You can get in contact with us at @TheFrontside on Twitter and Contact@Frontside.io over email. We'd love to hear from you. This just in, we're running a special. If you go to our website and enter the promo code 'ELRICK20,' you can get that 20% discount on your next custom developed web application. Go check that out. Take it easy, everybody. Bye-bye. JULIE: Bye-bye.

There's a new JavaScript created every few seconds. If you pick up any noun there's probably a JavsScript library named after that noun. What if you just used Vanilla JavaScript? Chris helps Scott answer that question, and more in this episode.

In this Episode of the JavaScript for WordPress Show, educator Zac Gordon talks with developer and educator Chris Ferdinandi. Chris has years of experience working with Vanilla JavaScript (and jQuery) and has several popular JavaScript plugins and learning resources.

Добрый день уважаемые слушатели. Представляем новый выпуск подкаста RWpod. В этом выпуске: Ruby String#concat, Array#concat and String#prepend take multiple arguments in Ruby 2.4, Do I really need to patch my Rails apps? (Understanding CVE-2016-6316) и Is Your Site Leaking Password Reset Links? Monitoring Sidekiq Using AWS Lambda and Slack, A Photo Gallery that Automatically Tags Your Images и Validation outside ActiveModel HexaPDF Code and First Version Released, Helpy is 1.0!, TZOffset - simple abstraction of a timezone offset и Screencast: Debugging With Byebug JavaScript Node v7.0.0, What's new in IndexedDB 2.0?, Vue.js is easier to learn than jQuery и Rising Trends in In JavaScript: A Comprehensive Guide to Libraries & Frameworks Redux without React — State Management in Vanilla JavaScript, Redux is Overhyped и OverReact - React for Dart Next.js – small framework for server-rendered universal JavaScript apps, MathJax - beautiful math in all browsers, Swip - a library to create multi device experiments, Shave - a javascript plugin that truncates multi-line text to fit within an html element based on a set max-height и JS Ipsum - generate your own JS gibberish