osmosfeed-template/index.html
2021-04-27 00:48:42 +00:00

809 lines
40 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>osmos::feed</title>
<link rel="shortcut icon" type="image/x-icon" href="assets/favicon.ico">
<link href="assets/styles.css" rel="stylesheet" />
</head>
<body>
<section class="day-container">
<h2>2021-04-27</h2>
<h3>freeCodeCamp.org</h3>
<section class="articles-per-source">
<article>
<details>
<summary>CSS Scrollbar Styling Tutorial How to Make a Custom Scrollbar</summary>
<div class="details-content">
<p>Have you ever visited a website with a custom scrollbar and wondered how they did it? After reading this article you will understand just about everything there is to know about customizing and styling scrollbars using CSS. In this tutorial you will: Learn the native CSS properties available for styling</p>
<a href="https&#58;&#47;&#47;www.freecodecamp.org&#47;news&#47;css&#45;scrollbar&#45;tutorial&#47;">Read · 8 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>How to Set Up Local Notifications in Flutter</summary>
<div class="details-content">
<p>Notifications are an excellent way to engage your users or to get them to go back to your application. You can also use notifications to make users pay attention to something while they're using the app. There are two types of notifications: Push NotificationsLocal NotificationsAs the title of this article</p>
<a href="https&#58;&#47;&#47;www.freecodecamp.org&#47;news&#47;local&#45;notifications&#45;in&#45;flutter&#47;">Read · 7 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-26</h2>
<h3>freeCodeCamp.org</h3>
<section class="articles-per-source">
<article>
<details>
<summary>The NGINX Handbook</summary>
<div class="details-content">
<p>A young Russian developer named Igor Sysoev was frustrated by older web servers' inability to handle more than 10 thousand concurrent requests. This is a problem referred to as the C10k problem. As an answer to this, he started working on a new web server back in 2002. NGINX was</p>
<a href="https&#58;&#47;&#47;www.freecodecamp.org&#47;news&#47;the&#45;nginx&#45;handbook&#47;">Read · 49 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>Git Push to Remote Branch How to Push a Local Branch to Origin</summary>
<div class="details-content">
<p>The basic command for pushing a local branch to a remote repository is git push. This command has a variety of options and parameters you can pass to it, and in this article you'll learn the ones that you will use the most often. How to push a local Git</p>
<a href="https&#58;&#47;&#47;www.freecodecamp.org&#47;news&#47;git&#45;push&#45;to&#45;remote&#45;branch&#45;how&#45;to&#45;push&#45;a&#45;local&#45;branch&#45;to&#45;origin&#47;">Read · 4 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>Learn CSS Media Queries by Building Three Projects</summary>
<div class="details-content">
<p>Today we're going to learn how to use CSS Media Queries to build responsive websites. And we'll practice what we learn by completing three projects. Let's go 🏅 Table of Contents What are CSS Media Queries?Steps to followThe SyntaxPractice ProjectsConclusionTopics to discuss at a glance: You can watch this tutorial</p>
<a href="https&#58;&#47;&#47;www.freecodecamp.org&#47;news&#47;learn&#45;css&#45;media&#45;queries&#45;by&#45;building&#45;projects&#47;">Read · 11 min</a>
</div>
</details>
</article>
</section>
<h3>CSS-Tricks</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Exploring color-contrast() for the first time.</summary>
<div class="details-content">
<p>I saw in the release notes for Safari Technical Preview 122 that it has support for a color-contrast() function in CSS. Safari is first out of the gate here. As far as I know, no other browser supports this yet &#8230;
The post Exploring color-contrast() for the first time. appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;css&#45;tricks.com&#47;exploring&#45;color&#45;contrast&#45;for&#45;the&#45;first&#45;time&#47;">Read · 3 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>Generating (and Solving!) Sudokus in CSS</summary>
<div class="details-content">
<p>I love to make CSS do stuff it shouldnt. Its the type of problem-solving brain training youd get building a calculator in Minecraft, except you probably wont get a job working with Minecraft Redstone no matter how good you &#8230;
The post Generating (and Solving!) Sudokus in CSS appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;css&#45;tricks.com&#47;generating&#45;and&#45;solving&#45;sudokus&#45;in&#45;css&#47;">Read · 15 min</a>
</div>
</details>
</article>
</section>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>How To Bake Layers Of Accessibility Testing Into Your Process</summary>
<div class="details-content">
<p>Accessibility experts Kate Kalcevich and Mike Gifford introduce readers to "layered accessibility testing”, a practice of using a variety of tools and approaches at different stages in the digital product lifecycle to catch accessibility issues early &mdash; when its easier and cheaper to fix them.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;bake&#45;layers&#45;accessibility&#45;testing&#45;process&#47;">Read · 11 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-23</h2>
<h3>freeCodeCamp.org</h3>
<section class="articles-per-source">
<article>
<details>
<summary>React Cheatsheet 9 Common HTML Rendering Cases You Should Know</summary>
<div class="details-content">
<p>Whenever I'm starting with a new framework or it's been a while since I've used it, I always end up searching for the same simple things. I'll Google how to render raw HTML, how to display a component based on a condition, how to assign a class to an element,</p>
<a href="https&#58;&#47;&#47;www.freecodecamp.org&#47;news&#47;react&#45;cheatsheet&#45;html&#45;rendering&#47;">Read · 3 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>How to Create a Data-driven Component with WordPress and Next.js</summary>
<div class="details-content">
<p>When you are building a content-driven website for a client, there is often some tension between creating a consistent user experience and adding some flair. If, like I am, you are mostly working in a headless way, you may also want your CMS to capture and serve raw data at</p>
<a href="https&#58;&#47;&#47;www.freecodecamp.org&#47;news&#47;create&#45;a&#45;data&#45;driven&#45;component&#45;with&#45;wordpress&#45;and&#45;nextjs&#47;">Read · 7 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>JavaScript Splice How to Use the .splice() JS Array Method</summary>
<div class="details-content">
<p>The splice() method is a built-in method for JavaScript Array objects. It lets you change the content of your array by removing or replacing existing elements with new ones. This method modifies the original array and returns the removed elements as a new array. In this tutorial, you will learn</p>
<a href="https&#58;&#47;&#47;www.freecodecamp.org&#47;news&#47;javascript&#45;splice&#45;how&#45;to&#45;use&#45;the&#45;splice&#45;js&#45;array&#45;method&#47;">Read · 3 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>How to Build Better Machine Learning Models</summary>
<div class="details-content">
<p>Hello developers 👋. If you have built Deep Neural Networks before, you might know that it can involve a lot of experimentation. In this article, I will share with you some useful tips and guidelines that you can use to better build better deep learning models. These tricks should make it</p>
<a href="https&#58;&#47;&#47;www.freecodecamp.org&#47;news&#47;how&#45;to&#45;build&#45;better&#45;machine&#45;learning&#45;models&#47;">Read · 9 min</a>
</div>
</details>
</article>
</section>
<h3>CSS-Tricks</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Eliminating five top compatibility pain points on the web</summary>
<div class="details-content">
<p>Robert Nyman and Philip Jägenstedt:
Google is working with other browser vendors and industry partners to fix the top five browser compatibility pain points for web developers. The areas of focus are CSS Flexbox, CSS Grid,&#160;position: sticky,&#160;
&#8230;
The post Eliminating five top compatibility pain points on the web appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;web.dev&#47;compat2021&#47;">Read · 4 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>Using New Gatsby Source WordPress Plugin</summary>
<div class="details-content">
<p>In my previous article, I discussed how I learned to create a decoupled WordPress powered Gatsby site using the Gatsby Source WPGraphQL plugin. The project was done following the ongoing developmental version of WPGraphQL and an excellent tutorial by Henrik &#8230;
The post Using New Gatsby Source WordPress Plugin appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;css&#45;tricks.com&#47;using&#45;new&#45;gatsby&#45;source&#45;wordpress&#45;plugin&#47;">Read · 20 min</a>
</div>
</details>
</article>
</section>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>A Guide To Newly Supported, Modern CSS Pseudo-Class Selectors</summary>
<div class="details-content">
<p>The CSS Working Group Editors Draft for [Selectors Level 4](https://drafts.csswg.org/selectors-4/) includes several pseudo-class selectors that already have proposal candidates in most modern browsers. This guide will cover ones that currently have the best support along with examples to demonstrate how you can start using them today!</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;guide&#45;supported&#45;modern&#45;css&#45;pseudo&#45;class&#45;selectors&#47;">Read · 8 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-22</h2>
<h3>CSS-Tricks</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Text That Sometimes Turns to Emojis</summary>
<div class="details-content">
<p>There are some Unicode characters that some browsers just decide they are going to turn into emojis for you. I couldn&#8217;t tell you why exactly, but here&#8217;s what I see:
Chrome on the left. Safari in the simulator on top&#8230;
The post Text That Sometimes Turns to Emojis appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;css&#45;tricks.com&#47;text&#45;that&#45;sometimes&#45;turns&#45;to&#45;emojis&#47;">Read · 5 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>The Almost-Complete Guide to Cumulative Layout Shift</summary>
<div class="details-content">
<p>Here&#8217;s Jess B. Peck writing all about Google&#8217;s Core Web Vitals:
Lets step back one. CLS is when youre about to click on a link, and the whole page shifts and you click on a different link instead. Its when
&#8230;
The post The Almost-Complete Guide to Cumulative Layout Shift appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;jessbpeck.com&#47;posts&#47;completecls&#47;">Read · 26 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>Tools to Improve UX and Win Over Your Customers</summary>
<div class="details-content">
<p>Try Hotjar for free today!
An enjoyable user experience and high conversion rates go hand-in-hand. It makes sense then, that if you want to improve conversion rates, your first task is to improve user experience.
To improve UX, deeply understanding &#8230;
The post Tools to Improve UX and Win Over Your Customers appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;css&#45;tricks.com&#47;tools&#45;to&#45;improve&#45;ux&#45;and&#45;win&#45;over&#45;your&#45;customers&#47;">Read · 5 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>The Making (and Potential Benefits) of a CSS Font</summary>
<div class="details-content">
<p>Not a typical one, at least. Each character is an HTML element, built with CSS. A true web font!
Let me elaborate. This is a way to render text without using any font at all. Random text is split with &#8230;
The post The Making (and Potential Benefits) of a CSS Font appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;css&#45;tricks.com&#47;the&#45;making&#45;and&#45;potential&#45;benefits&#45;of&#45;a&#45;css&#45;font&#47;">Read · 15 min</a>
</div>
</details>
</article>
</section>
<h3>freeCodeCamp.org</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Learn Django 3 and Start Creating Websites With Python</summary>
<div class="details-content">
<p>Django is the most popular full-stack web framework for Python. It helps people create web apps quickly. We just released a 7-hour course that will teach you how to use the newest version of Django to create web apps. The course also covers pandas, matplotlib, JavaScript, ajax, xhtml2pdf, dropzone.js,</p>
<a href="https&#58;&#47;&#47;www.freecodecamp.org&#47;news&#47;learn&#45;django&#45;3&#45;and&#45;start&#45;creating&#45;websites&#45;with&#45;python&#47;">Read · 2 min</a>
</div>
</details>
</article>
</section>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Web Design Done Well: The Ordinary Made Extraordinary (Part 1)</summary>
<div class="details-content">
<p>Sometimes its the little things in web life that make us look twice. From carousels to documentation to cookie disclaimers, here are some sites taking the mundane and sprinkling in a little magic.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;web&#45;design&#45;done&#45;well&#45;part1&#47;">Read · 6 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-21</h2>
<h3>CSS-Tricks</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Still Hoping for Better Native Page Transitions</summary>
<div class="details-content">
<p>It would be nice to be able to animate the transition between pages if we want to on the web without resorting to hacks or full-blown architecture choices to achieve it. I could imagine an API that would run stuff&#8230;
The post Still Hoping for Better Native Page Transitions appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;css&#45;tricks.com&#47;still&#45;hoping&#45;for&#45;better&#45;native&#45;page&#45;transitions&#47;">Read · 5 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>Sticky Headers: 5 Ways to Make Them Better</summary>
<div class="details-content">
<p>Page Laubheimer says that if you&#8217;re going to do a sticky header&#8230;
Keep it small.
Visually contrast it with the rest of the page.
If it&#8217;s going to move, keep it minimal. (I&#8217;d say, respect prefers-reduced-motion.)
Consider &#8220;partially persistent
&#8230;
The post Sticky Headers: 5 Ways to Make Them Better appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;www.nngroup.com&#47;articles&#47;sticky&#45;headers&#47;">Read · 8 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>How to Add a Double Border to SVG Shapes</summary>
<div class="details-content">
<p>Lets say someone asks you to add a double border to some random geometric SVG shapes. For some reason, you cant use any graphic editorthey need to be generated at runtimeso you have to solve it &#8230;
The post How to Add a Double Border to SVG Shapes appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;css&#45;tricks.com&#47;how&#45;to&#45;add&#45;a&#45;double&#45;border&#45;to&#45;svg&#45;shapes&#47;">Read · 5 min</a>
</div>
</details>
</article>
</section>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>A Complete Guide To Incremental Static Regeneration (ISR) With Next.js</summary>
<div class="details-content">
<p>Incremental Static Regeneration (ISR) is a new evolution of the Jamstack, allowing you to update static content instantly without needing a full rebuild of your site. The hybrid approach of Next.js allows you to use ISR for e-commerce, marketing pages, blog posts, ad-backed media, and more.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;incremental&#45;static&#45;regeneration&#45;nextjs&#47;">Read · 6 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>Why Content Is Such A Fundamental Part Of The Web Design Process</summary>
<div class="details-content">
<p>As designers, we are often burdened by the responsibility of producing and managing website content. Its not our job to write it, but its not the clients either. We can avert disaster by including content production in the design process.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;content&#45;fundamental&#45;part&#45;web&#45;design&#45;process&#47;">Read · 10 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-20</h2>
<h3>CSS-Tricks</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Intrinsic Typography is the Future of Styling Text on the Web</summary>
<div class="details-content">
<p>The way we style text hasnt changed much over the years. There have been numerous advancements to help make things more flexible, like layouts, but in terms of styling, most finite aspects of our designs, like text, remain relatively unchanged. &#8230;
The post Intrinsic Typography is the Future of Styling Text on the Web appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;css&#45;tricks.com&#47;intrinsic&#45;typography&#45;is&#45;the&#45;future&#45;of&#45;styling&#45;text&#45;on&#45;the&#45;web&#47;">Read · 10 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>Say Hello to CSS Container Queries</summary>
<div class="details-content">
<p>Container queries are finally here! Now available behind a flag in the latest version of Chrome Canary, you can go ahead and experiment to your hearts content. Oh, and if youre not familiar with container queries then check out &#8230;
The post Say Hello to CSS Container Queries appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;ishadeed.com&#47;article&#47;say&#45;hello&#45;to&#45;css&#45;container&#45;queries&#47;">Read · 7 min</a>
</div>
</details>
</article>
</section>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Making GraphQL Work In WordPress</summary>
<div class="details-content">
<p>Lets explore the plugins providing GraphQL servers to WordPress. When should we use WPGraphQL, and when the GraphQL API for WordPress? Is there some advantage of one over the other, or some particular task that is easier to accomplish with one of them? In this article, we will find out.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;making&#45;graphql&#45;work&#45;in&#45;wordpress&#47;">Read · 12 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-19</h2>
<h3>CSS-Tricks</h3>
<section class="articles-per-source">
<article>
<details>
<summary>How to Improve CSS Performance</summary>
<div class="details-content">
<p>There is no doubt that CSS plays a huge role in web performance. Milica Mihajlija puts a point on exactly why:
When there is CSS available for a page, whether its inline or an external stylesheet,&#160;the browser delays rendering
&#8230;
The post How to Improve CSS Performance appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;calibreapp.com&#47;blog&#47;css&#45;performance">Read · 7 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>Float an Element to the Bottom Corner</summary>
<div class="details-content">
<p>Need to lay out an element to the right or the left, such that text wraps around it? Thats an easy task for the float property. But what about if you also want to push that element (lets call it &#8230;
The post Float an Element to the Bottom Corner appeared first on CSS-Tricks.
You can support CSS-Tricks by being an MVP Supporter.</p>
<a href="https&#58;&#47;&#47;css&#45;tricks.com&#47;float&#45;an&#45;element&#45;to&#45;the&#45;bottom&#45;corner&#47;">Read · 6 min</a>
</div>
</details>
</article>
</section>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>An In-Depth Guide To Measuring Core Web Vitals</summary>
<div class="details-content">
<p>How are Core Web Vitals measured? How do you know your fixes have had the desired effect and when will you see the results in Google Search Console? Lets figure it out.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;complete&#45;guide&#45;measure&#45;core&#45;web&#45;vitals&#47;">Read · 24 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-16</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Seven Mistakes To Avoid In Your Technical Interviews</summary>
<div class="details-content">
<p>Its no secret that the technical interview process leaves something to be desired; its often riddled with anxiety and stress. In this article, well take a look at seven of the most common mistakes candidates make in their technical interviews and explore ways you can avoid them.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;mistakes&#45;technical&#45;interviews&#47;">Read · 10 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-15</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>How To Get Web Design Clients Fast (Part 2)</summary>
<div class="details-content">
<p>Selling is key to growing your web design business, but it doesnt have to be complicated! With clear goals, customer research, and proven closing techniques, anyone can find new clients.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;web&#45;design&#45;clients&#45;fast&#45;part2&#47;">Read · 12 min</a>
</div>
</details>
</article>
<article>
<details>
<summary>From Cats With Love: New Navigation, Guides And Workshops</summary>
<div class="details-content">
<p>At Smashing, weve been busy over the last few months. Weve set up new workshops, redesigned our navigation, refined performance and improved accessibility. There are subtle UX changes coming in, and wed love to share what weve been cooking.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;from&#45;cats&#45;with&#45;love&#45;navigation&#45;guides&#45;workshops&#47;">Read · 3 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-14</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Overflow Issues In CSS</summary>
<div class="details-content">
<p>In this article, we will explore the causes of overflow issues and how to solve them. We will also explore how modern features in the developer tools (DevTools) can make the process of fixing and debugging easier.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;css&#45;overflow&#45;issues&#47;">Read · 6 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-13</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Building A Video Streaming App With Nuxt.js, Node And Express</summary>
<div class="details-content">
<p>In this article, well be building a video streaming app using Nuxt.js and Node.js. Specifically, well build a server-side Node.js app that will handle fetching and streaming videos, generating thumbnails for your videos, and serving captions and subtitles.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;building&#45;video&#45;streaming&#45;app&#45;nuxtjs&#45;node&#45;express&#47;">Read · 11 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-12</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>A Complete Guide To HTML Email</summary>
<div class="details-content">
<p>Recently weve covered CSS generators, SVG generators and accessible front-end components. This time we look into HTML email, with tools, templates and guides for designers and developers.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;complete&#45;guide&#45;html&#45;email&#45;templates&#45;tools&#47;">Read · 10 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-09</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Growing UX Maturity In Organizations: Education And Training (Part 3)</summary>
<div class="details-content">
<p>UX practitioners can play an important role in growing the UX maturity of the organizations and product teams they work with. This final article in a three-part series presents two additional tactics: education of staff on UX principles and processes.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;growing&#45;ux&#45;maturity&#45;in&#45;organizations&#45;part&#45;3&#47;">Read · 20 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-08</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Better Documentation And Team Communication With Product Design Docs</summary>
<div class="details-content">
<p>Have you ever struggled to get the green light on your design proposals? Do you feel like your design process needs to be formalized? Is the COVID19 era becoming a challenge for you when working remotely as a designer? Then keep reading to get to know a methodology to document your design process in this article.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;better&#45;documentation&#45;team&#45;communication&#45;product&#45;design&#45;docs&#47;">Read · 6 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-07</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Flaky Tests: Getting Rid Of A Living Nightmare In Testing</summary>
<div class="details-content">
<p>Unreliable tests are a living nightmare for anyone who writes automated tests or pays attention to the results. Flaky tests have even given folks nightmares and sleepless nights. In this article, Ramona Schwering shares her experiences to help you get out of this hell or avoid getting into it.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;flaky&#45;tests&#45;living&#45;nightmare&#47;">Read · 13 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-06</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Dont Lose Your Head: Evaluating Headless</summary>
<div class="details-content">
<p>With many options comes many decisions, and it is easy to drown in all the many benefits of headless CMS. How do we approach evaluating these options? Lets figure it out.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;evaluating&#45;headless&#47;">Read · 14 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-05</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Vanilla JavaScript Code Snippets</summary>
<div class="details-content">
<p>A guide to vanilla JavaScript code snippets &mdash; with resources and lightweight libraries to help you solve a problem without a large overhead or third-party dependencies.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;vanilla&#45;javascript&#45;code&#45;snippets&#47;">Read · 7 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-02</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Guarding Against Disposable Design</summary>
<div class="details-content">
<p>Quick, constant change is a given on the web. It is often one of its greatest strengths. As ever, though, there is a balance to find. Although longevity takes a different form online, its value is immeasurable.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;guarding&#45;against&#45;disposable&#45;design&#47;">Read · 11 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-04-01</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Meet Utopia: Designing And Building With Fluid Type And Space Scales</summary>
<div class="details-content">
<p>By systemizing the fundamentals of typography and space, and leaning into the inherent fluidity of the web, a free new CSS tool called [Utopia](https://utopia.fyi/) offers an alternative to breakpoint-driven design.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;04&#47;designing&#45;developing&#45;fluid&#45;type&#45;space&#45;scales&#47;">Read · 8 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-03-31</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>The Small Joys Of April (2021 Wallpapers Edition)</summary>
<div class="details-content">
<p>Lets welcome the new month with some fresh wallpapers. Designed with love by artists and designers from across the globe, they are available with and without a calendar for April 2021.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;03&#47;desktop&#45;wallpaper&#45;calendars&#45;april&#45;2021&#47;">Read · 7 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-03-30</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>Choosing A New Serverless Database Technology At An Agency (Case Study)</summary>
<div class="details-content">
<p>In this article, Michael Rispoli explains how he evaluated the decision of whether or not to adopt a serverless database for client projects. This decision will focus on three lenses: the functional aspects of the technology, the developer experience, and the business ramifications of adoption.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;03&#47;choosing&#45;new&#45;serverless&#45;database&#45;technology&#45;agency&#47;">Read · 19 min</a>
</div>
</details>
</article>
</section>
</section>
<section class="day-container">
<h2>2021-03-29</h2>
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
<section class="articles-per-source">
<article>
<details>
<summary>SVG Generators</summary>
<div class="details-content">
<p>A complete guide to SVG generators &mdash; for everything from SVG shapes and cropping tools to SVG filters, color matrix mixers and SVG to JSX generators.</p>
<a href="https&#58;&#47;&#47;smashingmagazine.com&#47;2021&#47;03&#47;svg&#45;generators&#47;">Read · 12 min</a>
</div>
</details>
</article>
</section>
</section>
<footer>
<time id="build-timestamp" datetime="2021-04-27T00:48:42.381Z">2021-04-27T00:48:42.381Z</time>
<span><a href="https://github.com/osmoscraft/osmosfeed">osmosfeed 1.2.3</a></span>
</footer>
<script src="assets/index.js"></script>
</body>
</html>