mirror of
https://github.com/osmoscraft/osmosfeed-template.git
synced 2026-03-11 14:44:24 +00:00
942 lines
No EOL
58 KiB
HTML
942 lines
No EOL
58 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<title>osmos::feed</title>
|
||
<meta charset="utf-8" />
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||
<meta name="robots" content="noindex, nofollow" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
|
||
<link rel="alternate" type="application/rss+xml" title="osmos::feed" href="feed.atom" />
|
||
<link href="index.css" rel="stylesheet" />
|
||
<!-- %before-head-end.html% -->
|
||
</head>
|
||
|
||
<body>
|
||
<!-- %after-body-begin.html% -->
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-10-04">2021-10-04</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://css-tricks.com">CSS-Tricks</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Quickly Testing CSS Fallbacks</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/quickly-testing-css-fallbacks/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(2 min)</span>
|
||
<span>Dumb trick alert!
|
||
Not all browsers support all features. Say you want to write a fallback for browsers that doesn’t support CSS Grid. Not very common these days, but it’s just to illustrate a point.
|
||
You could write the supporting …
|
||
The post Quickly Testing CSS Fallbacks appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Animation Techniques for Adding and Removing Items From a Stack</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/animation-techniques-for-adding-and-removing-items-from-a-stack/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(16 min)</span>
|
||
<span>Animating elements with CSS can either be quite easy or quite difficult depending on what you are trying to do. Changing the background color of a button when you hover over it? Easy. Animating the position and size of an …
|
||
The post Animation Techniques for Adding and Removing Items From a Stack appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">ShopTalk Goes Video</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/shoptalk-goes-video/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(2 min)</span>
|
||
<span>Dave and I slapped up a little videos section of the ShopTalk website. Twelve so far! They are short-ish, between 10-20 minutes, each focused on one fairly specific thing. We’re kinda just dipping our toes here — we don’t …
|
||
The post ShopTalk Goes Video appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.freecodecamp.org/news">freeCodeCamp.org</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">How to Use the Traceroute and Ping Commands to Troubleshoot Network Connectivity Issues</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/traceroute-and-ping/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(4 min)</span>
|
||
<span>Ping and traceroute are common commands you can use to troubleshoot network problems. Ping is a simple command that can test the reachability of a device on the network. Traceroute is a command you use to 'trace' the route that a packet takes when traveling to its destination. It's useful</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">How to Build Your Own Developer Portfolio Website with HTML, CSS, and JavaScript</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/how-to-build-a-developer-portfolio-website/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(22 min)</span>
|
||
<span>Everyone needs websites and web applications these days. So there are many opportunities for you if you work as a web developer. But if you want to get a web developer job, you'll need a good portfolio website to showcase your skills and experience. In this tutorial, I'll discuss some</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">What is the OSI Model? Computer Networking for Beginners</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/osi-model-computer-networking-for-beginners/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(6 min)</span>
|
||
<span>In this article, you will learn about the core concepts of the Open Systems Interconnections (OSI) model in a simple and easy way. As a developer, it's a good idea to learn how things work "under the hood". That way you understand what your code and the tools you use</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">What is UX Design? User Experience Design Explained in Plain English</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/user-experience-design-what-does-a-ux-designer-do/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(4 min)</span>
|
||
<span>You might have heard of the term User Experience or UX design. But what does it mean exactly? In this article, I will explain what UX design is and talk about how to become a UX designer. What is UX design?The term User Experience refers to how users interact</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">How To Build An Expandable Accessible Gallery</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/10/build-expandable-accessible-gallery/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(9 min)</span>
|
||
<span>In this article, we’ll be looking at how to set up a gallery that is expandable as well as accessible with a few tips and tricks along the way. Let’s get started!</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-10-03">2021-10-03</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.freecodecamp.org/news">freeCodeCamp.org</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">The 250 Best Free Online Courses of All Time – A Data-Driven Analysis [2021 Edition]</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/best-online-courses/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(40 min)</span>
|
||
<span>Every year Class Central releases a list of the Best Free Online Courses Of All Time, based on tens of thousands of user reviews. This year, thanks to a growing number of reviews, I've expanded the list from 200 to 250 courses. For close to ten years, well-known and well-respected</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-10-01">2021-10-01</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://css-tricks.com">CSS-Tricks</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Links on React and JavaScript II</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/links-on-react-and-javascript-ii/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(3 min)</span>
|
||
<span>How To Use The Vite Build Tool with React — Vite is hot, in part, because it’s based on esbuild and wickedly fast. It’s from Evan You of Vue fame, but it’s not a Vue-specific tool. Here, NARUHODO covers how
|
||
…
|
||
The post Links on React and JavaScript II appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Using the platform</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://elisehe.in/2021/08/22/using-the-platform">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(11 min)</span>
|
||
<span>I'm certainly not dogmatic about it, but I think if you can pull of a project with literally zero build process, it feels good while working on it and feels very good when you come back to it months/years later and can just pick up and go.
|
||
The post Using the platform appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Working With Built-in GraphQL Directives</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/working-with-built-in-graphql-directives/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(5 min)</span>
|
||
<span>Directives are one of GraphQL’s best — and most unspoken — features.
|
||
Let’s explore working with GraphQL’s built-in schema and operation directives that all GraphQL spec compliant APIs must implement. They are extremely useful if you are working with a …
|
||
The post Working With Built-in GraphQL Directives appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.freecodecamp.org/news">freeCodeCamp.org</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">How to Solve the Problem of Multiple Inheritance in Java</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/how-to-solve-multiple-inheritance-in-java/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(5 min)</span>
|
||
<span>Java is one of the most popular object-oriented programming languages in use today. Because it is platform-independent, you will find Java applications on every type of device and every operating system. And because Java is relatively easy to learn, it is one of the first languages that many programmers pick</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">How To Implement Search Functionality In Your Nuxt App Using Algolia InstantSearch</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/10/search-functionality-nuxt-app-algolia-instantsearch/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(16 min)</span>
|
||
<span>Many websites have some sort of search feature because it helps users navigate through their content easily. Implementing it the right way can be tricky and might not give a good user experience. In this tutorial, we will be integrating Algolia, a popular and powerful search service for the best experience on our Nuxt site.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-30">2021-09-30</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://css-tricks.com">CSS-Tricks</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Creating the Perfect Commit in Git</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/creating-the-perfect-commit-in-git/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(8 min)</span>
|
||
<span>A commit can be something that helps us stay on top of things. It can be a container for related changes that belong to one and only one topic, and thereby make it easier for us to understand what happened.
|
||
In this post, we’re talking about what it takes to produce the "perfect" commit.
|
||
The post Creating the Perfect Commit in Git appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Comparing HTML Preprocessor Features</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/comparing-html-preprocessor-features/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(9 min)</span>
|
||
<span>(This is a sponsored post.)
|
||
Of the languages that browsers speak, I’d wager that the very first one that developers decided needed some additional processing was HTML. Every single CMS in the world (aside from intentionally headless-only CMSs) …
|
||
The post Comparing HTML Preprocessor Features appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.freecodecamp.org/news">freeCodeCamp.org</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Accessibility Best Practices for Mobile App Development</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/mobile-accessibility/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(6 min)</span>
|
||
<span>The United States Census Bureau estimates that more than 12% of the United States' population is living with a disability. Disabilities can include vision difficulties, hearing difficulties, mobility challenges, and much more. And a person can become disabled at any stage of their life. Since a significant portion of the</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">HTML Bullet Points – How to Create an Unordered List with the <ul> Tag Example</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/html-bullet-points-how-to-create-an-unordered-list-with-the-ul-tag-example/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(4 min)</span>
|
||
<span>We use lists all the time in our everyday lives. We create them to structure and organize our days, and we use them to make to-do lists. We use them in recipes so we don't miss any of the steps. And we use them when we want to assemble a</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">SQL Distinct Statement – How to Query, Select, and Count</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/sql-distinct-statement-how-to-query-select-and-count/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(4 min)</span>
|
||
<span>In SQL, you can make a database query and use the COUNT function to get the number of rows for a particular group in the table. In this article, I will show you how to use the COUNT function with a few code examples. What is the COUNT function in</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Git for Professionals – Free Version Control Course</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/git-for-professionals/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(20 min)</span>
|
||
<span>Almost every software developer uses git. Many use it continually throughout the day. While you may already know the very basics of git, your productivity will be increased if you learn some advanced git concepts. We just released a git course on the freeCodeCamp.org YouTube channel that will help</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">A Time Of Transition (October 2021 Desktop Wallpapers Edition)</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/desktop-wallpaper-calendars-october-2021/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(8 min)</span>
|
||
<span>Get your desktop ready for fall and the upcoming Halloween season with a fresh batch of desktop wallpapers. Created with love by designers and artists from across the globe, they come in versions with and without a calendar for October 2021.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-29">2021-09-29</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://css-tricks.com">CSS-Tricks</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Web Streams Everywhere (and Fetch for Node.js)</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/web-streams-everywhere-and-fetch-for-node-js/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(8 min)</span>
|
||
<span>Chrome developer advocate Jake Archibald called 2016 “the year of web streams.” Clearly, his prediction was somewhat premature. The Streams Standard was announced back in 2014. It’s taken a while, but there’s now a consistent streaming API implemented …
|
||
The post Web Streams Everywhere (and Fetch for Node.js) appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Front-End Dev Shortcuts in iOS 15</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/front-end-dev-shortcuts-in-ios-15/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(4 min)</span>
|
||
<span>I was pretty stoked when Chris shared a way to “View Source” on mobile. Sure, it’s not the same as a built-in feature but it allows iOS users like myself a way to peek at a site’s code the …
|
||
The post Front-End Dev Shortcuts in iOS 15 appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Using Modern Image Formats: AVIF And WebP</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/modern-image-formats-avif-webp/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(17 min)</span>
|
||
<span>In this article, we’ll highlight how modern image formats (AVIF or WebP) can improve compression by up to 50% and deliver better quality per-byte while still looking visually appealing. We’ll compare what’s possible at high-quality, low-quality and file-size targets.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-28">2021-09-28</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://css-tricks.com">CSS-Tricks</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">So many little design helper sites!</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/so-many-little-design-helper-sites/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(2 min)</span>
|
||
<span>I had one of those little single-serving designer helper sites bookmarked the other day: getwaves.io. Randomized SVG waves! Lots of cool options! Easy to customize! Easy to copy and paste! Well played, z creative labs.
|
||
|
||
But then I …
|
||
The post So many little design helper sites! appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">iOS Browser Choice</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/ios-browser-choice/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(6 min)</span>
|
||
<span>Just last week I got one of those really?! 🤨 faces when this fact came up in conversation amongst smart and engaged fellow web developers: there is no browser choice on iOS. It’s all Safari. You can download apps that …
|
||
The post iOS Browser Choice appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Web Unleashed is Back! (Use Coupon Code “CSS-Tricks” for 50% Off)</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://fitc.ca/event/webu21/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(5 min)</span>
|
||
<span>(This is a sponsored post.)
|
||
Now in its tenth year (!!!), Web Unleashed is one of the top events for web devs. It’s coming up quick: October 20-22, 2021.
|
||
The lineup is amazing. You’ll hear from leaders in …
|
||
The post Web Unleashed is Back! (Use Coupon Code “CSS-Tricks” for 50% Off) appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Improving The Accessibility Of Your Markdown</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/improving-accessibility-of-markdown/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(13 min)</span>
|
||
<span>You can find Markdown in many places on the Internet. This article covers different aspects of Markdown and how it interacts with other technology.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-27">2021-09-27</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://css-tricks.com">CSS-Tricks</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Tonic (Component Framework)</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/tonic-component-framework/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(2 min)</span>
|
||
<span>I enjoy little frameworks like Tonic. It’s essentially syntactic sugar over to make them feel easier to use. Define a Class, template literal an HTML template, probably some other fancy helpers, and you’ve got a component …
|
||
The post Tonic (Component Framework) appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Collecting Email Signups With the Notion API</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/collecting-email-signups-with-the-notion-api/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(15 min)</span>
|
||
<span>A lot of people these days are setting up their own newsletters. You’ve got the current big names like Substack and MailChimp, companies like Twitter are getting into it with Revue, and even Facebook is getting into the …
|
||
The post Collecting Email Signups With the Notion API appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Let’s Dive Into Cypress For End-to-End Testing</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/cypress-end-to-end-testing/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(17 min)</span>
|
||
<span>Is end-to-end testing a painful topic for you? In this article, Ramona Schwering explains how to handle end-to-end testing with Cypress and make it make it not so tedious and expensive for yourself, but fun instead.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-26">2021-09-26</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://github.com/osmoscraft/osmosfeed/releases">Release notes from osmosfeed</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">v1.11.2</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://github.com/osmoscraft/osmosfeed/releases/tag/v1.11.2">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(1 min)</span>
|
||
<span>Fixed: unicode characters in URL caused download error
|
||
Fixed: project root npm install error
|
||
Added: unit test library
|
||
Chore: Dependency updates
|
||
Thank you: @CaptNo1</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-24">2021-09-24</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Rebuilding A Large E-Commerce Website With Next.js (Case Study)</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/lessons-learned-ecommerce-nextjs-case-study/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(13 min)</span>
|
||
<span>We made the switch from a more traditional integrated e-commerce platform to a headless platform with Next.js. Here are the most important lessons learned while rebuilding a large e-commerce site with Next.js.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Free Online Workshop: Frustrating Design Patterns And How To Fix Them</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/smashing-workshop-frustrating-design-patterns/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(3 min)</span>
|
||
<span>You’ve seen them before. Confusing and frustrating design patterns that seem to be chasing you everywhere you go, from one website to another. It’s time to fix them for good in a [free Smashing online workshop](https://smashingconf.com/online-workshops/workshops/vitaly-friedman-frustrating-patterns/) next week.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-23">2021-09-23</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Simplifying Form Styles With `accent-color`</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/simplifying-form-styles-accent-color/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(7 min)</span>
|
||
<span>The new CSS `accent-color` property makes it quick and easy to roll out our brand colors to certain form inputs by leveraging user agent styles. In this article we’ll take a look at what it does and how to use it alongside `color-scheme` for simple, accessible checkboxes and radio buttons — and imagine how we might use it in the future.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-22">2021-09-22</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Getting Your `head` Straight: A New CSS Performance Diagnostics Snippet</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/css-head-tag/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(2 min)</span>
|
||
<span>We love little useful tools and techniques to help folks get their work done better and faster. Today, we’d love to shine the spotlights on a little helper that helps spot common performance bottlenecks easily: [ct.css](https://csswizardry.com/ct/).</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-21">2021-09-21</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">How To Build Your Own Mouseless Development Environment</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/mouseless-development-environment/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(14 min)</span>
|
||
<span>Building a development environment with the shell as a keystone offers multiple benefits. You can customize everything depending on your own needs, and the biggest of all, you can control your entire development environment with your keyboard.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">How Web Development Tools Are Helping Users Keep Pace With Rapid Change</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/web-development-tools-users-keep-pace-rapid-change/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(6 min)</span>
|
||
<span>The last 18 months have been a time of unprecedented turbulence. As the people of the world have flooded online, businesses have joined them, using web development tools to adapt in real-time.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-20">2021-09-20</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Are Imposter Domains Re-Publishing Your Website?</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/imposter-domains-republishing-website/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(13 min)</span>
|
||
<span>Content scraping is a fact of life on the Internet. When you think of web scraping, you probably do not think about the scrapers turning around and immediately serving your entire, whole page content on another website. But what if your site content is being re-published? It might be already happening.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-17">2021-09-17</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Monetize Open-Source Software With Gatsby Functions And Stripe</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/monetize-open-source-software-gatsby-functions-stripe/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(9 min)</span>
|
||
<span>Gatsby Functions provide front-end developers a way to write and use server-side code without the hassle of maintaining a server. If making money from open-source is of interest to you and your site isn’t built using Gatsby, this approach may well be the answer you were looking for.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-16">2021-09-16</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://github.com/osmoscraft/osmosfeed/releases">Release notes from osmosfeed</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">v1.11.1</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://github.com/osmoscraft/osmosfeed/releases/tag/v1.11.1">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(1 min)</span>
|
||
<span>Fixed: Unexpected nested element in author field crashes the parser
|
||
Thank you @ad-m</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Web Quality Assurance: From User Requirements To Web Risk Management</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/journey-into-web-quality-assurance/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(15 min)</span>
|
||
<span>Twenty years ago, Elie Sloïm chose to dedicate his professional life to web quality assurance. He started asking, ”What does quality mean for a web user?” Well, this article explains everything he has learned along the way.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Reasons To Build A CRM-Powered Website For Your Business</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/reasons-build-crm-powered-website-business/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(8 min)</span>
|
||
<span>Integrating a CRM with your business website has numerous benefits. In this article, Zara Cooper explains what these benefits are and why websites should be integrated with a CRM platform.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-15">2021-09-15</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Reducing The Need For Pseudo-Elements</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/reducing-need-pseudo-elements/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(6 min)</span>
|
||
<span>For years, pseudo-elements have faithfully helped front-end developers implement creative designs. While they still have an important place, we can now leave pseudo-elements behind in some scenarios, thanks to newer CSS properties.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-14">2021-09-14</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">The Power Of Pen And Paper Sketching</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/power-pen-paper-sketching/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(7 min)</span>
|
||
<span>When designing for digital spaces, it’s natural to default to digital mockup tools, but doing so cuts out a world of possibilities. Analog drawing can unleash your imagination and allow you to focus on what’s most important at the start: the ideas.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-13">2021-09-13</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Orchestrating Complexity With Web Animations API</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/orchestrating-complexity-web-animations-api/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(10 min)</span>
|
||
<span>There are way too many options in Web Animations API to pick them up that easily. Learning how timing works and how to control the playback of several animations at once makes for a solid foundation on which to base your projects on.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-10">2021-09-10</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Web Design Done Well: Excellent Editorial</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/web-design-done-well-excellent-editorial/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(7 min)</span>
|
||
<span>They say content is king, and they’re right. The web has unlocked untold possibilities for storytellers — provided the story is right, of course. Here are some of our favorite examples of editorial content thriving in the digital realm.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-09">2021-09-09</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Using SWR React Hooks With Next.js’ Incremental Static Regeneration (ISR)</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/useswr-react-hook-library-incremental-static-regeneration-nextjs/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(7 min)</span>
|
||
<span>When paired with ISR and Next.js’ API routes, SWR can be used to create a responsive user experience. In this article, Sam Poder explains what SWR is, where to use it (and where not), and how to build a website by using Incremental Static Regeneration.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-08">2021-09-08</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">Developer Decisions For Building Flexible Components</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/developer-decisions-building-flexible-components/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(10 min)</span>
|
||
<span>In this article, we’ll walk through the process of taking a seemingly simple design for a text-and-media component and deciding how best to translate it into code, keeping in mind the needs of both users and content authors.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">New Smashing Online Workshops on Front-End & UX</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/new-smashing-online-workshops-sep-2021/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(3 min)</span>
|
||
<span>What’s the state of HTML Email, Vue.js and Next.js? What are new, smart interface design patterns we could use? Let’s figure it out. With our brand new online workshops on front-end & design. Now with **free workshops** for you to test the waters.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-07">2021-09-07</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">What’s New With DevTools: Cross-Browser Edition</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/devtools-cross-browser-edition/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(13 min)</span>
|
||
<span>Learn what’s new with developer tools in Firefox, Edge, Chrome and Safari. Discover new and powerful features that will help you be more comfortable and productive when testing and debugging across browsers.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<section class="daily-content">
|
||
<h2 class="daily-heading"><time datatime="2021-09-06">2021-09-06</time></h2>
|
||
<ul class="sources card">
|
||
<li class="source">
|
||
<section>
|
||
<h3 class="source-name"><a class="source-name__link" href="https://www.smashingmagazine.com/">Articles on Smashing Magazine — For Web Designers And Developers</a></h3>
|
||
<section class="articles-per-source">
|
||
<article>
|
||
<details class="article-expander">
|
||
<summary class="article-expander__title">HTTP/3: Practical Deployment Options (Part 3)</summary>
|
||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/09/http3-practical-deployment-options-part3/">
|
||
<div class="article-summary-box-inner">
|
||
<span class="article-reading-time">(32 min)</span>
|
||
<span>After almost five years in development, the new HTTP/3 protocol is nearing its final form. Let’s take a close look at the challenges involved in deploying and testing HTTP/3, and how and if you should change your websites and resources as well.</span>
|
||
</div>
|
||
</a>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<footer>
|
||
<time id="build-timestamp" datetime="2021-10-05T00:42:08.052Z">2021-10-05T00:42:08.052Z</time>
|
||
<span><a class="footer-link" href="https://github.com/osmoscraft/osmosfeed">osmosfeed 1.11.2</a></span>
|
||
</footer>
|
||
<script src="index.js"></script>
|
||
<!-- %before-body-end.html% -->
|
||
</body>
|
||
|
||
</html> |