mirror of
https://github.com/osmoscraft/osmosfeed-template.git
synced 2026-03-11 14:44:24 +00:00
815 lines
41 KiB
HTML
815 lines
41 KiB
HTML
<!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-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’t tell you why exactly, but here’s what I see:
|
||
Chrome on the left. Safari in the simulator on top…
|
||
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://css-tricks.com/text-that-sometimes-turns-to-emojis/">Read · 3 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
|
||
<article>
|
||
<details>
|
||
<summary>The Almost-Complete Guide to Cumulative Layout Shift</summary>
|
||
<div class="details-content">
|
||
<p>Here’s Jess B. Peck writing all about Google’s Core Web Vitals:
|
||
Let’s step back one. CLS is when you’re about to click on a link, and the whole page shifts and you click on a different link instead. It’s when
|
||
…
|
||
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://jessbpeck.com/posts/completecls/">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 …
|
||
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://css-tricks.com/tools-to-improve-ux-and-win-over-your-customers/">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 …
|
||
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://css-tricks.com/the-making-and-potential-benefits-of-a-css-font/">Read · 12 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://www.freecodecamp.org/news/learn-django-3-and-start-creating-websites-with-python/">Read · 2 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
|
||
<article>
|
||
<details>
|
||
<summary>UML Diagram Course – How to Design Databases and Systems</summary>
|
||
<div class="details-content">
|
||
<p>UML is a standard way to diagram computer systems or databases. UML helps developers visualize the relationships between different pieces of software or hardware so they can more easily plan development. What does UML Stand for? A UML Definition in Plain EnglishUML stands for Unified Modeling Language. IBM engineer Grady</p>
|
||
<a href="https://www.freecodecamp.org/news/uml-diagrams-full-course/">Read · 1 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
|
||
<article>
|
||
<details>
|
||
<summary>Learn Data Structures by Building a Flask API with Python</summary>
|
||
<div class="details-content">
|
||
<p>People often learn about data structures out-of-context. It can be helpful to see how they are used in a real-world project. We just published a course on the freeCodeCamp.org YouTube channel that will help you learn foundational data structure concepts by building a real-world API using Python and Flask.</p>
|
||
<a href="https://www.freecodecamp.org/news/learn-data-structures-flask-api-python/">Read · 1 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 it’s 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://smashingmagazine.com/2021/04/web-design-done-well-part1/">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…
|
||
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://css-tricks.com/still-hoping-for-better-native-page-transitions/">Read · 4 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’re going to do a sticky header…
|
||
Keep it small.
|
||
Visually contrast it with the rest of the page.
|
||
If it’s going to move, keep it minimal. (I’d say, respect prefers-reduced-motion.)
|
||
Consider “partially persistent
|
||
…
|
||
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://www.nngroup.com/articles/sticky-headers/">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>Let’s say someone asks you to add a double border to some random geometric SVG shapes. For some reason, you can’t use any graphic editor — they need to be generated at runtime — so you have to solve it …
|
||
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://css-tricks.com/how-to-add-a-double-border-to-svg-shapes/">Read · 4 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
|
||
|
||
<h3>freeCodeCamp.org</h3>
|
||
<section class="articles-per-source">
|
||
|
||
<article>
|
||
<details>
|
||
<summary>How to Become a Technical Writer</summary>
|
||
<div class="details-content">
|
||
<p>Technical writing helps you share your technical knowledge and experience with others. It also helps you reinforce your knowledge of the topic you're writing about while demonstrating your technical abilities and talents. In this article, I will explain what you need to know to become a technical writer. We'll learn</p>
|
||
<a href="https://www.freecodecamp.org/news/how-to-become-a-technical-writer/">Read · 10 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
|
||
<article>
|
||
<details>
|
||
<summary>How to Combine First and Last Name in Excel</summary>
|
||
<div class="details-content">
|
||
<p>In Excel, you might have a column with first names and a column with last names that you want to join. In this tutorial I will explain how you can easily accomplish this. Let's say we have the list of first names in column A and the list of last</p>
|
||
<a href="https://www.freecodecamp.org/news/combine-first-last-names-excel/">Read · 2 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
|
||
<article>
|
||
<details>
|
||
<summary>How to Auto-Deploy Your React Apps with Cloudflare Pages</summary>
|
||
<div class="details-content">
|
||
<p>In this article, I'm going to show you how to very quickly deploy any React application with the help of Cloudflare pages. You'll see how to not only build and deploy your app within minutes using just a few tools, but also how to auto-deploy any future changes you make</p>
|
||
<a href="https://www.freecodecamp.org/news/how-to-auto-deploy-your-react-apps-with-cloudflare-pages/">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://smashingmagazine.com/2021/04/incremental-static-regeneration-nextjs/">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. It’s not our job to write it, but it’s not the client’s either. We can avert disaster by including content production in the design process.</p>
|
||
<a href="https://smashingmagazine.com/2021/04/content-fundamental-part-web-design-process/">Read · 10 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
|
||
</section>
|
||
|
||
|
||
<section class="day-container">
|
||
<h2>2021-04-20</h2>
|
||
|
||
<h3>freeCodeCamp.org</h3>
|
||
<section class="articles-per-source">
|
||
|
||
<article>
|
||
<details>
|
||
<summary>How to Convert HTML to PDF with Azure Functions and wkhtmltopdf</summary>
|
||
<div class="details-content">
|
||
<p>In this article, we are going to use Azure Functions and the wkhtmltopdf tool to generate a PDF file from an HTML file. You might want to create a PDF file for a great many reasons, such as generating invoices for sales, medical reports for your patients, insurance forms for</p>
|
||
<a href="https://www.freecodecamp.org/news/convert-html-to-pdf-with-azure-functions-and-wkhtmltopdf/">Read · 9 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
|
||
|
||
<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 hasn’t 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. …
|
||
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://css-tricks.com/intrinsic-typography-is-the-future-of-styling-text-on-the-web/">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 heart’s content. Oh, and if you’re not familiar with container queries then check out …
|
||
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://ishadeed.com/article/say-hello-to-css-container-queries/">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>Let’s 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://smashingmagazine.com/2021/04/making-graphql-work-in-wordpress/">Read · 12 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
|
||
</section>
|
||
|
||
|
||
<section class="day-container">
|
||
<h2>2021-04-19</h2>
|
||
|
||
<h3>freeCodeCamp.org</h3>
|
||
<section class="articles-per-source">
|
||
|
||
<article>
|
||
<details>
|
||
<summary>Git Switch Branch – How to Change the Branch in Git</summary>
|
||
<div class="details-content">
|
||
<p>Switching branches is something you'll need to do often in Git. To do this, you can use the git checkout command. How to create a new branch in GitTo create a new branch in Git, you use the git checkout command and pass the -b flag with a name. This</p>
|
||
<a href="https://www.freecodecamp.org/news/git-switch-branch/">Read · 3 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
|
||
<article>
|
||
<details>
|
||
<summary>How to Manage Code Dependencies by Shimming Your Abstractions</summary>
|
||
<div class="details-content">
|
||
<p>Dependencies are a very common part of any sufficiently mature codebase. And it's important to cleanly handle any third party code that your program relies on to function. There are multiple ways to get third party code included and updated. And I read something recently which has easily become my</p>
|
||
<a href="https://www.freecodecamp.org/news/manage-code-dependencies-by-shimming-your-abstractions/">Read · 6 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
|
||
<article>
|
||
<details>
|
||
<summary>How to Write a Good README File for Your GitHub Project</summary>
|
||
<div class="details-content">
|
||
<p>If you are reading this article, it probably means that you are already pushing repositories to GitHub and maybe even contributing to open source. And if you're using GitHub, it means that you will need to write good documentation for your projects to help others understand them. If you are</p>
|
||
<a href="https://www.freecodecamp.org/news/how-to-write-a-good-readme-file/">Read · 5 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
|
||
|
||
<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 it’s inline or an external stylesheet, the browser delays rendering
|
||
…
|
||
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://calibreapp.com/blog/css-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? That’s an easy task for the float property. But what about if you also want to push that element (let’s call it …
|
||
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://css-tricks.com/float-an-element-to-the-bottom-corner/">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? Let’s figure it out.</p>
|
||
<a href="https://smashingmagazine.com/2021/04/complete-guide-measure-core-web-vitals/">Read · 24 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
|
||
</section>
|
||
|
||
|
||
<section class="day-container">
|
||
<h2>2021-04-16</h2>
|
||
|
||
<h3>CSS-Tricks</h3>
|
||
<section class="articles-per-source">
|
||
|
||
<article>
|
||
<details>
|
||
<summary>Creating an Editable Textarea That Supports Syntax-Highlighted Code</summary>
|
||
<div class="details-content">
|
||
<p>When I was working on a project that needed an editor component for source code, I really wanted a way to have that editor highlight the syntax its typed. There are projects like this, like CodeMirror, Ace, and …
|
||
The post Creating an Editable Textarea That Supports Syntax-Highlighted Code appeared first on CSS-Tricks.
|
||
You can support CSS-Tricks by being an MVP Supporter.</p>
|
||
<a href="https://css-tricks.com/creating-an-editable-textarea-that-supports-syntax-highlighted-code/">Read · 9 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
|
||
<article>
|
||
<details>
|
||
<summary>Platform News: Using :focus-visible, BBC’s New Typeface, Declarative Shadow DOMs, A11Y and Placeholders</summary>
|
||
<div class="details-content">
|
||
<p>There’s a whole lot of accessibility in this week’s news, from the nuances of using :focus-visible and input placeholders, to accessible typefaces and a Safari bug with :display: contents. Plus, a snippet for a bare-bones web component that supports …
|
||
The post Platform News: Using :focus-visible, BBC’s New Typeface, Declarative Shadow DOMs, A11Y and Placeholders appeared first on CSS-Tricks.
|
||
You can support CSS-Tricks by being an MVP Supporter.</p>
|
||
<a href="https://css-tricks.com/platform-news-using-focus-visible-bbcs-new-typeface-declarative-shadow-doms-a11y-and-placeholders/">Read · 5 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
|
||
<article>
|
||
<details>
|
||
<summary>Not Your Typical Horizontal Rules</summary>
|
||
<div class="details-content">
|
||
<p>The default browser style for <hr> is so weird. It’s basically:
|
||
border-style: inset;
|
||
border-width: 1px;
|
||
The default border-color is black, but the border doesn’t actually look black, because the inset border “adds a split tone to the line …
|
||
The post Not Your Typical Horizontal Rules appeared first on CSS-Tricks.
|
||
You can support CSS-Tricks by being an MVP Supporter.</p>
|
||
<a href="https://www.sarasoueidan.com/blog/horizontal-rules/">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>Seven Mistakes To Avoid In Your Technical Interviews</summary>
|
||
<div class="details-content">
|
||
<p>It’s no secret that the technical interview process leaves something to be desired; it’s often riddled with anxiety and stress. In this article, we’ll 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://smashingmagazine.com/2021/04/mistakes-technical-interviews/">Read · 10 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
|
||
</section>
|
||
|
||
|
||
<section class="day-container">
|
||
<h2>2021-04-15</h2>
|
||
|
||
<h3>CSS-Tricks</h3>
|
||
<section class="articles-per-source">
|
||
|
||
<article>
|
||
<details>
|
||
<summary>Flash of inAccurate coloR Theme (FART)</summary>
|
||
<div class="details-content">
|
||
<p>There is a lot to think about when implementing a dark mode theme on a website. We have a huge guide on it. There are some very clever quick wins out there, but there are also some quite tricky things …
|
||
The post Flash of inAccurate coloR Theme (FART) appeared first on CSS-Tricks.
|
||
You can support CSS-Tricks by being an MVP Supporter.</p>
|
||
<a href="https://css-tricks.com/flash-of-inaccurate-color-theme-fart/">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>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 doesn’t have to be complicated! With clear goals, customer research, and proven closing techniques, anyone can find new clients.</p>
|
||
<a href="https://smashingmagazine.com/2021/04/web-design-clients-fast-part2/">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, we’ve been busy over the last few months. We’ve set up new workshops, redesigned our navigation, refined performance and improved accessibility. There are subtle UX changes coming in, and we’d love to share what we’ve been cooking.</p>
|
||
<a href="https://smashingmagazine.com/2021/04/from-cats-with-love-navigation-guides-workshops/">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://smashingmagazine.com/2021/04/css-overflow-issues/">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, we’ll be building a video streaming app using Nuxt.js and Node.js. Specifically, we’ll 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://smashingmagazine.com/2021/04/building-video-streaming-app-nuxtjs-node-express/">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 we’ve 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://smashingmagazine.com/2021/04/complete-guide-html-email-templates-tools/">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://smashingmagazine.com/2021/04/growing-ux-maturity-in-organizations-part-3/">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://smashingmagazine.com/2021/04/better-documentation-team-communication-product-design-docs/">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://smashingmagazine.com/2021/04/flaky-tests-living-nightmare/">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>Don’t 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? Let’s figure it out.</p>
|
||
<a href="https://smashingmagazine.com/2021/04/evaluating-headless/">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 — with resources and lightweight libraries to help you solve a problem without a large overhead or third-party dependencies.</p>
|
||
<a href="https://smashingmagazine.com/2021/04/vanilla-javascript-code-snippets/">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://smashingmagazine.com/2021/04/guarding-against-disposable-design/">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://smashingmagazine.com/2021/04/designing-developing-fluid-type-space-scales/">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>Let’s 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://smashingmagazine.com/2021/03/desktop-wallpaper-calendars-april-2021/">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://smashingmagazine.com/2021/03/choosing-new-serverless-database-technology-agency/">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 — for everything from SVG shapes and cropping tools to SVG filters, color matrix mixers and SVG to JSX generators.</p>
|
||
<a href="https://smashingmagazine.com/2021/03/svg-generators/">Read · 12 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
|
||
</section>
|
||
|
||
|
||
<section class="day-container">
|
||
<h2>2021-03-26</h2>
|
||
|
||
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
|
||
<section class="articles-per-source">
|
||
|
||
<article>
|
||
<details>
|
||
<summary>Growing UX Maturity: Knowledge Sharing And Mentorship (Part 2)</summary>
|
||
<div class="details-content">
|
||
<p>This article presents tactics that can be helpful for those working in organizations that have started engaging in UX, but are still at the lower to middle stages of maturity: knowledge sharing and mentorship.</p>
|
||
<a href="https://smashingmagazine.com/2021/03/growing-ux-maturity-in-organizations-part-2/">Read · 14 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
|
||
</section>
|
||
|
||
|
||
<section class="day-container">
|
||
<h2>2021-03-25</h2>
|
||
|
||
<h3>Articles on Smashing Magazine — For Web Designers And Developers</h3>
|
||
<section class="articles-per-source">
|
||
|
||
<article>
|
||
<details>
|
||
<summary>How To Boost Media Performance On A Budget</summary>
|
||
<div class="details-content">
|
||
<p>How do we get media performance right while staying within performance budgets? Let’s take a look at the recent stats and data around performance budgets, video playback performance issues and some techniques and tools to address these issues.</p>
|
||
<a href="https://smashingmagazine.com/2021/03/boost-media-performance/">Read · 7 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
|
||
<article>
|
||
<details>
|
||
<summary>Reactivity In Vue</summary>
|
||
<div class="details-content">
|
||
<p>Reactivity is the ability for a variable (array, string, number, object, etc) to update when its value or any other variable that it makes reference to is changed after declaration.</p>
|
||
<a href="https://smashingmagazine.com/2021/03/reactivity-in-vue/">Read · 8 min</a>
|
||
</div>
|
||
</details>
|
||
</article>
|
||
</section>
|
||
|
||
</section>
|
||
|
||
<footer>
|
||
<time id="build-timestamp" datetime="2021-04-23T00:49:12.524Z">2021-04-23T00:49:12.524Z</time>
|
||
<span><a href="https://github.com/osmoscraft/osmosfeed">osmosfeed 1.2.3</a></span>
|
||
</footer>
|
||
|
||
<script src="assets/index.js"></script>
|
||
</body>
|
||
</html>
|