Best of Smashing Magazine2022

  1. 1
    Article
    Avatar of smashingSmashing Magazine·4y

    You Don’t Need A UI Framework — Smashing Magazine

    Josh Comeau is a software developer, educator, amateur pianist, and cat person. He’s spent the past few years working as a software engineer for orgs like Khan … More about Josh. Email Newsletter Your (smashing) email Weekly tips on front-end & UX.

  2. 2
    Article
    Avatar of smashingSmashing Magazine·4y

    JavaScript APIs You Don’t Know About — Smashing Magazine

    The State of JS Survey is an online survey that collects data from developers around the world to see the most recent and upcoming trends in the JavaScript community. Among the most used features are Optional chaining, Nullish coalescing, Websockets, and so on. The most popular was using the blur and focus browser events, using the blurred and focus Browser events.

  3. 3
    Article
    Avatar of smashingSmashing Magazine·4y

    Futuristic CSS — Smashing Magazine

    The State of CSS survey is open right now, so go take it! The goal of the survey is to help anticipate future CSS trends, and the data is also used by browser vendors to inform their roadmap. The @image proposal might be a step in that direction, as it gives you tools to define or modify images right inside your CSS code.

  4. 4
    Article
    Avatar of smashingSmashing Magazine·4y

    UX Checklists For Interface Designers — Smashing Magazine

    Checklist is an open-source checklist to planning, building and growing a design system. It includes the foundation of things to keep in mind for design language, design tokens, core components, tooling and project management. Text-To-Timeline Tool Markdown is an incredible little tool to generate timelines, e.g.

  5. 5
    Article
    Avatar of smashingSmashing Magazine·4y

    New CSS Features In 2022 — Smashing Magazine

    Container queries enable us to style an element depending on the size of its parent. This is a crucial difference from media queries, which only query the viewport. This has long been a problem for responsive design, as often we want a component to adapt to its context. Some are already starting to land in browsers, others are likely to gain widespread browser support in 2022.

  6. 6
    Article
    Avatar of smashingSmashing Magazine·4y

    The Future Of Frontend Build Tools — Smashing Magazine

    Frontend tooling gives us so much today that it is hard to imagine that there was a time when it was not even needed at all. A trip down memory lane could help us understand how we got here. Frontend build tooling is crucial to the workflow of the modern frontend developer for a host of reasons classified under improved developer and user experiences.

  7. 7
    Article
    Avatar of smashingSmashing Magazine·4y

    Using Nothing But Docker For Projects — Smashing Magazine

    Using only Docker to build and run applications and commands removes the need for previous knowledge in some tool or programming language. This way, you can run any Maven and Java commands without having to install Java or Maven. Using Docker for Running The Application’s Dockerfile is where this article starts. The book is a practical guide to optimizing and delivering high-quality images.

  8. 8
    Article
    Avatar of smashingSmashing Magazine·4y

    Those HTML Attributes You Never Use — Smashing Magazine

    The enterkeyhint attribute is a global attribute that can be applied to form controls or elements that have contenteditable set to true. This attribute assists users on mobile devices that use a virtual on-screen keyboard. An unrecognized value will just default to whatever the device’s default text is for the enter key.

  9. 9
    Article
    Avatar of smashingSmashing Magazine·4y

    Five Data-Loading Patterns To Improve Frontend Performance — Smashing Magazine

    The main goal of SSR is to give the user a static HTML with the prerequisite data. Unlike CSR, SSR doesn’t need to make another API call to the backend because the server generates an HTML template and loads any data within it. Newer solutions like Next.js use hydration, where the static HTML will be hydrated on the client side using JavaScript.

  10. 10
    Article
    Avatar of smashingSmashing Magazine·3y

    An Ultimate Guide On Sizing, Spacing, Grids And Layout In Web And UI

    A spatial system is a set of design guidelines about spacing, sizing, and dimensions of user interface components. Grids provide a structure for the layout of elements, while a spatial system defines rules for using spacing and sizing. When a design does not have an immediately recognizable spatial pattern, users may find it inconsistent and unreliable.

  11. 11
    Article
    Avatar of smashingSmashing Magazine·3y

    Optimizing A Vue App — Smashing Magazine

    Vue apps can provide a rich, interactive user experience when dealing with real-time, dynamic data. But they can also be heavy, bloated, and perform poorly. In this article, we'll walk through some of the front-end optimization tips to keep our apps relatively lean and only ship the JS we need.