Logo

    796: Do We Need JS Frameworks × Are You Over-Engineering? × Webview vs Native

    enJuly 17, 2024
    What challenges do Wes and Scott face with Google Forms?
    How can attending meetups benefit developers?
    What is progressive enhancement in web development?
    What tools are mentioned for modern web development?
    Why is testing important before deployment?

    Podcast Summary

    • Google Forms vs CodebaseGoogle Forms may be easy to use but they have limitations for handling long text responses, while thoroughly testing and reviewing code before deployment is crucial to avoid unexpected issues

      Despite being developers, Wes and Scott, the hosts of Syntax, sometimes resort to using Google Forms for handling potluck questions due to the ease of use and the usefulness of the Google Drive workflow. However, they acknowledge that Google Forms may not be the most ideal solution for handling long text responses, as reading through them in a spreadsheet can be frustrating. They jokingly referred to this as a "failure of engineering." They also shared stories of discovering and fixing unintended large file sizes in their codebase, which led to unexpected issues after deployment. For instance, they discussed an Easter egg CD animation that was too large and caused issues, as well as a method call that caused a "not a number" error due to a misrepresented type. These incidents highlight the importance of thoroughly testing and reviewing code before deployment to avoid potential issues.

    • Software Design BalanceStriking a balance between overengineering and having a messy codebase is important in software design. Experience and understanding software design principles can help determine necessary abstraction level.

      The lack of a database in the past prevented the development of more complex features, but now that a database is available, there's no excuse not to build them. Overengineering, or adding unnecessary complexity, can be a problem when it makes implementation, maintenance, and deployment more difficult. However, it's important to strike a balance between overengineering and having a messy codebase. Experience is key in determining what level of abstraction is necessary, and a good rule of thumb is to keep things together while allowing for future expansion. The concept of overengineering is something that is learned over time, and it's important to understand the principles behind software design to make informed decisions. The book "Fundamentals of Software Architecture" can provide valuable insights into software design principles and help improve the way we design systems.

    • Tools and frameworks in software developmentBe mindful of tools and frameworks, avoid over-reliance, consider pros and cons of WebView apps for mobile development, focus on performance optimization for successful WebView apps, use PNPM workspaces for managing mono repos

      When it comes to software development, it's essential to be mindful of the tools and frameworks we use and why we use them. Over-reliance on specific libraries and frameworks can lead to unnecessary complexity. Regarding mobile apps, both WebView-based apps and native components have their pros and cons. WebView apps can function well when done correctly, offering a "deploy everywhere" situation. However, they often get a bad reputation due to poorly executed implementations. To create a successful WebView app, focus on local data storage, design guidelines, and performance optimization. For managing mono repos, PNPM workspaces are a recommended option due to their flexibility and simplicity.

    • Managing monorepos, AI energy consumptionStriking a balance between simplicity and added functionality is crucial when managing monorepos. TurboRepo offers advantages but can introduce unnecessary complexity. AI models require significant energy for training and usage, with potential solutions including bringing models closer to users and making them run on devices.

      When it comes to managing monorepos for software development, it's essential to strike a balance between simplicity and added functionality. While tools like TurboRepo offer advantages like caching and simplifying complexities, they can also introduce unnecessary complexity and frustration for smaller projects. The speaker personally prefers using NPM workspaces and PNPM for running them, but adds TurboRepo for faster builds when needed. Regarding energy consumption, the most significant energy usage in AI comes from training the models, which requires powerful hardware like supercomputers. However, using the models does consume energy as well. Although AI models are deterministic by nature, they are designed to be less predictable to provide more varied responses. To reduce energy consumption, bringing models closer to the user and making them run on devices as they get smaller and more purpose-built are potential solutions. Additionally, companies are incentivized to make AI models run faster and cheaper to save on costs.

    • Web Development FrameworksFrameworks are essential for complex and dynamic web projects, providing benefits like context preservation, improved performance, and easier development for features like animations and real-time data updates.

      While it's possible to build a website using only HTML, CSS, and vanilla JavaScript, the use of frameworks becomes necessary as projects become more complex and dynamic. Frameworks provide benefits such as context preservation, improved performance, and easier development, especially for features like animations and real-time data updates. While some argue that simpler projects don't require frameworks, the reality is that most modern web development involves more dynamic content and user interaction, making frameworks essential tools for developers. The decision to use a framework ultimately depends on the specific needs and goals of the project.

    • Web development toolsUnderstanding the unique needs of each web development project is essential to making informed decisions about the tools and strategies used.

      While it's important to focus on the actual product and not just continually be churning out new technology, there's also a need to understand that different projects require different tools. The complexity of web development and the various types of applications being built make it essential to consider the unique needs of each project. Ad blockers are a common issue for services like analytics and error handling, but proxying data to these third-party services can help bypass the blockers. However, this method requires additional setup and resources. It's crucial to remember that the web development landscape is diverse, and understanding the specific needs of each project is key to making informed decisions about the tools and strategies used.

    • Progressive EnhancementBuild web applications with HTML first, ensuring basic functionality without JavaScript, then enhance user experience with JavaScript when available.

      While most users have JavaScript enabled, it's essential to write web applications with progressive enhancement in mind. This means building forms and websites with HTML first, ensuring they function without JavaScript, and then enhancing the user experience with JavaScript when it's available. Tools like Webpack, TurboPack, Babel, Metro, and Post CSS are commonly used in modern web development, but not everyone needs to learn them deeply. Higher-level tools often handle these complexities, allowing developers to focus on building great user experiences. The web development landscape has evolved, making it easier to create and deploy websites with minimal configuration and understanding of lower-level tools.

    • Developer MeetupsAttending developer meetups can provide opportunities for networking, learning new skills, and building relationships within the development community. Platforms like Meetup.com can help find these groups, but personal connections and social media are also effective. Introverts may find it helpful to attend with a friend or colleague.

      Attending local developer meetups and events can be a valuable experience for networking and learning new skills. Meetup.com is a popular platform for finding these groups, but social media and personal connections can also be effective. Extroverted individuals can help initiate conversations, while introverts may find it helpful to attend with a friend or colleague. Starting a local meetup or simply reaching out to developers in your area can also lead to valuable connections. These events offer opportunities to meet like-minded individuals, learn about new technologies, and build relationships within the development community. Overall, attending developer meetups and events can be an energizing and rewarding experience.

    • Waterless car washWaterless car washes maintain a car's appearance and include water repellent properties, saving time and resources, and are beneficial for car owners with matte paint finishes

      Using a waterless car wash solution, like Rainax Waterless Wash, can help maintain the appearance of a car between full washes. This method is particularly useful for those who don't have the time or resources for a detailed car wash but still want their vehicle to look clean and shiny. Additionally, waterless car wash solutions often include water repellent properties, making the car's windows more effective at repelling water. For car owners with matte paint finishes, waterless washes can be a lifesaver as traditional car washes can damage the finish. Furthermore, there are various to-do apps available, but finding one that suits personal preferences and doesn't add unnecessary complexity can be a challenge. Tweak, a to-do app based on pen and paper style systems, offers a minimalist interface and essential features for managing tasks without overwhelming the user.

    • Syntax merchandiseThe Syntax team has updated their website with a new audio player and added new features, and they offer various merchandise in their shop, including t-shirts and a new koozie.

      During the latest episode of the Syntax.fm podcast, Wes Bos shared his excitement about using a simple to-do app and gave a shameless plug for the updates on their website. The team has put in a lot of effort into re-implementing the audio player and adding new features. He also promoted their shop where listeners can find various Syntax merchandise, including new t-shirts supporting open-source projects. Wes even showcased his favorite "sick pick" t-shirt and mentioned a new seven-dollar double-walled stainless can koozie. The team promised to keep adding new items to the shop. Overall, the podcast episode was filled with enthusiasm for their projects and a chance for listeners to engage with the Syntax community through merchandise.

    Recent Episodes from Syntax - Tasty Web Development Treats

    817: You Need These 30 Apps - PART 1

    817: You Need These 30 Apps - PART 1

    Scott and Wes kick off part 1 of a 2-part series, breaking down 30 must-have apps for web developers and productivity enthusiasts. From file management tools to media utilities, they cover everything you need to supercharge your workflow.

    Show Notes

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    816: Why Your CSS Sucks

    816: Why Your CSS Sucks

    Scott and Wes break down why your CSS might suck—from misusing specificity to not leveraging CSS variables. Tune in as they dive into common pitfalls that are making your stylesheets a hot mess.

    Show Notes

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    815: Deno 2 with Ryan Dahl

    815: Deno 2 with Ryan Dahl

    In this episode of Syntax, Wes and Scott talk with Ryan Dahl about Deno 2.0, its new features and use of web standards, and how it seamlessly integrates with popular frameworks like Next.js. Ryan shares insights on the motivations behind Deno’s creation, its emphasis on simplicity and security, and offers his take on the evolving JavaScript ecosystem.

    Show Notes

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    814: Fundamentals: HTML

    814: Fundamentals: HTML

    In this episode of Syntax, Wes and Scott talk about HTML fundamentals — from basic structure and semantics to practical tips for better accessibility and SEO. They also discuss the difference between block and inline elements, form functionalities, HTML5 elements like dialog and canvas, and more.

    Show Notes

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    813: CSS: Scroll Driven Animations

    813: CSS: Scroll Driven Animations

    In this episode of Syntax, Wes and Scott talk about CSS’ new scroll-driven animations, its implementation, uses, and potential pitfalls. They also discuss animation-timeline and animation-range, and how they can be utilized to control animations based on scroll positions.

    Show Notes

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    812: CSS 4, 5, and 6! With Google’s Una and Adam

    812: CSS 4, 5, and 6! With Google’s Una and Adam

    In this episode of Syntax, Wes and Scott talk with Una Kravetz and Adam Argyle from Google Chrome about the evolution of CSS, new features, and the push toward more advanced UI capabilities on the web. They discuss the introduction of CSS versioning, exciting new properties like text-box-trim, state queries, and scroll state functionalities, select, and more!

    Show Notes

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    How To Stay Up To Date with Daily.dev’s Francesco Ciulla

    How To Stay Up To Date with Daily.dev’s Francesco Ciulla

    In this episode of Syntax, Scott and Wes talk with Daily.dev’s Francesco Ciulla about the platform's history, community features, and significant growth. They dive into the core ideas behind daily.dev, including its personalized feed for developers, new features like squads, community contributions, and tech stack. Francesco also shares his passion for Rust, and highlights the importance of content creation in the ever-evolving tech landscape.

    Show Notes

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    808: The Future of JavaScript Frameworks × Building Auth × DB Design Tips, and more!

    808: The Future of JavaScript Frameworks × Building Auth × DB Design Tips, and more!

    In this potluck episode of Syntax, Wes and Scott answer your questions about the future of JavaScript frameworks, building custom authentication systems, limiting API access, using Caddy server proxy for local development, component props in JSX, structuring a relational database, and more!

    Show Notes

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads