mirror of
https://github.com/osmoscraft/osmosfeed-template.git
synced 2026-03-11 14:44:24 +00:00
deploy: 1f5684a2ae
This commit is contained in:
parent
10c70dabfd
commit
92fe63dcc7
3 changed files with 245 additions and 222 deletions
166
cache.json
166
cache.json
|
|
@ -30,11 +30,29 @@
|
|||
"feedUrl": "https://css-tricks.com/feed/",
|
||||
"siteUrl": "https://css-tricks.com",
|
||||
"articles": [
|
||||
{
|
||||
"id": "https://css-tricks.com/?p=352723",
|
||||
"author": "Ollie Williams",
|
||||
"description": "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 …\nThe post Web Streams Everywhere (and Fetch for Node.js) appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.",
|
||||
"link": "https://css-tricks.com/web-streams-everywhere-and-fetch-for-node-js/",
|
||||
"publishedOn": "2021-09-29T14:51:25.000Z",
|
||||
"wordCount": 2072,
|
||||
"title": "Web Streams Everywhere (and Fetch for Node.js)"
|
||||
},
|
||||
{
|
||||
"id": "https://css-tricks.com/?p=352627",
|
||||
"author": "Geoff Graham",
|
||||
"description": "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 …\nThe post Front-End Dev Shortcuts in iOS 15 appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.",
|
||||
"link": "https://css-tricks.com/front-end-dev-shortcuts-in-ios-15/",
|
||||
"publishedOn": "2021-09-29T14:51:22.000Z",
|
||||
"wordCount": 1014,
|
||||
"title": "Front-End Dev Shortcuts in iOS 15"
|
||||
},
|
||||
{
|
||||
"id": "https://css-tricks.com/?p=352669",
|
||||
"author": "Chris Coyier",
|
||||
"description": "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. \n\nBut then I …\nThe post So many little design helper sites! appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.",
|
||||
"link": "https://css-tricks.com/__trashed/",
|
||||
"link": "https://css-tricks.com/so-many-little-design-helper-sites/",
|
||||
"publishedOn": "2021-09-28T21:00:04.000Z",
|
||||
"wordCount": 651,
|
||||
"title": "So many little design helper sites!"
|
||||
|
|
@ -45,7 +63,7 @@
|
|||
"description": "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 …\nThe post iOS Browser Choice appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.",
|
||||
"link": "https://css-tricks.com/ios-browser-choice/",
|
||||
"publishedOn": "2021-09-28T14:26:23.000Z",
|
||||
"wordCount": 1595,
|
||||
"wordCount": 1798,
|
||||
"title": "iOS Browser Choice"
|
||||
},
|
||||
{
|
||||
|
|
@ -54,7 +72,7 @@
|
|||
"description": "(This is a sponsored post.)\nNow in its tenth year (!!!), Web Unleashed is one of the top events for web devs. It’s coming up quick: October 20-22, 2021. \nThe lineup is amazing. You’ll hear from leaders in …\nThe 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.",
|
||||
"link": "https://fitc.ca/event/webu21/",
|
||||
"publishedOn": "2021-09-28T14:24:34.000Z",
|
||||
"wordCount": 1483,
|
||||
"wordCount": 1491,
|
||||
"title": "Web Unleashed is Back! (Use Coupon Code “CSS-Tricks” for 50% Off)"
|
||||
},
|
||||
{
|
||||
|
|
@ -63,7 +81,7 @@
|
|||
"description": "I enjoy little frameworks like Tonic. It’s essentially syntactic sugar over <web-components /> 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 …\nThe post Tonic (Component Framework) appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.",
|
||||
"link": "https://css-tricks.com/tonic-component-framework/",
|
||||
"publishedOn": "2021-09-27T18:52:46.000Z",
|
||||
"wordCount": 622,
|
||||
"wordCount": 636,
|
||||
"title": "Tonic (Component Framework)"
|
||||
},
|
||||
{
|
||||
|
|
@ -72,7 +90,7 @@
|
|||
"description": "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 …\nThe post Collecting Email Signups With the Notion API appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.",
|
||||
"link": "https://css-tricks.com/collecting-email-signups-with-the-notion-api/",
|
||||
"publishedOn": "2021-09-27T15:26:01.000Z",
|
||||
"wordCount": 4008,
|
||||
"wordCount": 4145,
|
||||
"title": "Collecting Email Signups With the Notion API"
|
||||
},
|
||||
{
|
||||
|
|
@ -99,7 +117,7 @@
|
|||
"description": "Let’s say we want to add something to a webpage after the initial load. JavaScript gives us a variety of tools. Perhaps you’ve used some of them, like append, appendChild, insertAdjacentHTML, or innerHTML.\nThe difficult thing …\nThe post Comparing Methods for Appending and Inserting With JavaScript appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.",
|
||||
"link": "https://css-tricks.com/comparing-methods-for-appending-and-inserting-with-javascript/",
|
||||
"publishedOn": "2021-09-24T14:34:59.000Z",
|
||||
"wordCount": 2448,
|
||||
"wordCount": 2554,
|
||||
"title": "Comparing Methods for Appending and Inserting With JavaScript"
|
||||
},
|
||||
{
|
||||
|
|
@ -151,24 +169,6 @@
|
|||
"length": "36722146",
|
||||
"type": "video/mp4"
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "https://css-tricks.com/?p=352388",
|
||||
"author": "Chris Coyier",
|
||||
"description": "When I came up in web development (2005-2010 were formative years for me), one of the first lessons I learned was to have a clean foundation of HTML. “What Beautiful HTML Code Looks Like” is actually one of the most …\nThe post Twitter’s div Soup and Uglyfied CSS, Explained appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.",
|
||||
"link": "https://giuseppegurgone.com/twitter-html/",
|
||||
"publishedOn": "2021-09-22T21:09:12.000Z",
|
||||
"wordCount": 1146,
|
||||
"title": "Twitter’s div Soup and Uglyfied CSS, Explained"
|
||||
},
|
||||
{
|
||||
"id": "https://css-tricks.com/?p=352074",
|
||||
"author": "Sarthak Duggal",
|
||||
"description": "Logging, on its own, is a key aspect of any application. Logging helps developers comprehend what it is that their code is doing. It also helps save developers hours of debugging work. This tutorial is about implementing logging in a …\nThe post How to Implement Logging in a Node.js Application With Pino-logger appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.",
|
||||
"link": "https://css-tricks.com/how-to-implement-logging-in-a-node-js-application-with-pino-logger/",
|
||||
"publishedOn": "2021-09-22T14:33:10.000Z",
|
||||
"wordCount": 2540,
|
||||
"title": "How to Implement Logging in a Node.js Application With Pino-logger"
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
@ -177,13 +177,27 @@
|
|||
"feedUrl": "https://www.smashingmagazine.com/feed/",
|
||||
"siteUrl": "https://www.smashingmagazine.com/",
|
||||
"articles": [
|
||||
{
|
||||
"id": "https://smashingmagazine.com/2021/09/modern-image-formats-avif-webp/",
|
||||
"author": "hello@smashingmagazine.com (Addy Osmani)",
|
||||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/modern-image-formats-avif-webp/",
|
||||
"publishedOn": "2021-09-29T08:25:00.000Z",
|
||||
"wordCount": 5044,
|
||||
"title": "Using Modern Image Formats: AVIF And WebP",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/67b6e428-ea96-41b4-baf2-6be51577910d/modern-image-formats-avif-webp.jpg",
|
||||
"length": "0",
|
||||
"type": "image/jpg"
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "https://smashingmagazine.com/2021/09/improving-accessibility-of-markdown/",
|
||||
"author": "hello@smashingmagazine.com (Eric Bailey)",
|
||||
"description": "You can find Markdown in many places on the Internet. This article covers different aspects of Markdown and how it interacts with other technology.",
|
||||
"link": "https://smashingmagazine.com/2021/09/improving-accessibility-of-markdown/",
|
||||
"publishedOn": "2021-09-28T09:00:00.000Z",
|
||||
"wordCount": 3860,
|
||||
"wordCount": 3868,
|
||||
"title": "Improving The Accessibility Of Your Markdown",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/fa95c8d2-8322-4766-ac8d-891dabff0dd6/improving-accessibility-of-markdown.jpg",
|
||||
|
|
@ -197,7 +211,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/cypress-end-to-end-testing/",
|
||||
"publishedOn": "2021-09-27T11:30:00.000Z",
|
||||
"wordCount": 4961,
|
||||
"wordCount": 4948,
|
||||
"title": "Let’s Dive Into Cypress For End-to-End Testing",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/2c42e65f-5a60-4844-a252-00169b21ab0c/cypress-end-to-end-testing.jpg",
|
||||
|
|
@ -211,7 +225,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/lessons-learned-ecommerce-nextjs-case-study/",
|
||||
"publishedOn": "2021-09-24T10:00:00.000Z",
|
||||
"wordCount": 3800,
|
||||
"wordCount": 3789,
|
||||
"title": "Rebuilding A Large E-Commerce Website With Next.js (Case Study)",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/5f1d9e62-ec85-435a-8899-56ac48b4190b/lessons-learned-ecommerce-nextjs.jpg",
|
||||
|
|
@ -239,7 +253,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/simplifying-form-styles-accent-color/",
|
||||
"publishedOn": "2021-09-23T11:00:00.000Z",
|
||||
"wordCount": 2148,
|
||||
"wordCount": 2149,
|
||||
"title": "Simplifying Form Styles With `accent-color`",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/195a9e83-5686-47fd-80d9-3c1d6dc4655a/simplifying-form-styles-accent-color.jpg",
|
||||
|
|
@ -295,7 +309,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/imposter-domains-republishing-website/",
|
||||
"publishedOn": "2021-09-20T11:30:00.000Z",
|
||||
"wordCount": 3966,
|
||||
"wordCount": 3962,
|
||||
"title": "Are Imposter Domains Re-Publishing Your Website?",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/4504ea89-0356-45c7-a7c1-a5c360ecc471/imposter-domains-republishing-website.jpg",
|
||||
|
|
@ -309,7 +323,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/monetize-open-source-software-gatsby-functions-stripe/",
|
||||
"publishedOn": "2021-09-17T09:00:00.000Z",
|
||||
"wordCount": 2571,
|
||||
"wordCount": 2572,
|
||||
"title": "Monetize Open-Source Software With Gatsby Functions And Stripe",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/73f6525b-6678-4db1-a875-16150bc822cd/monetize-open-source-software-gatsby-functions-stripe.jpg",
|
||||
|
|
@ -323,7 +337,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/journey-into-web-quality-assurance/",
|
||||
"publishedOn": "2021-09-16T12:00:00.000Z",
|
||||
"wordCount": 4504,
|
||||
"wordCount": 4500,
|
||||
"title": "Web Quality Assurance: From User Requirements To Web Risk Management",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/da816ee2-199c-49e8-8f63-f50d1fb5adb7/journey-into-web-quality-assurance.jpg",
|
||||
|
|
@ -351,7 +365,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/reducing-need-pseudo-elements/",
|
||||
"publishedOn": "2021-09-15T10:00:00.000Z",
|
||||
"wordCount": 1934,
|
||||
"wordCount": 1932,
|
||||
"title": "Reducing The Need For Pseudo-Elements",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/c994e024-5695-4cf7-b9b6-dc589e547f19/reducing-need-pseudo-elements.jpg",
|
||||
|
|
@ -365,7 +379,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/power-pen-paper-sketching/",
|
||||
"publishedOn": "2021-09-14T09:30:00.000Z",
|
||||
"wordCount": 2091,
|
||||
"wordCount": 2082,
|
||||
"title": "The Power Of Pen And Paper Sketching",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/e4a5bd0b-53db-40c2-90d9-9d0a19b8d377/power-pen-paper-sketching.jpg",
|
||||
|
|
@ -379,7 +393,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/orchestrating-complexity-web-animations-api/",
|
||||
"publishedOn": "2021-09-13T09:00:00.000Z",
|
||||
"wordCount": 2996,
|
||||
"wordCount": 2991,
|
||||
"title": "Orchestrating Complexity With Web Animations API",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/cc4a9b5f-fd83-4fc0-9966-6f98707d1466/orchestrating-complexity-web-animations-api.jpg",
|
||||
|
|
@ -393,7 +407,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/web-design-done-well-excellent-editorial/",
|
||||
"publishedOn": "2021-09-10T10:00:00.000Z",
|
||||
"wordCount": 2037,
|
||||
"wordCount": 2033,
|
||||
"title": "Web Design Done Well: Excellent Editorial",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/7af3bbbe-821b-4e3c-870a-f8290ed52212/web-design-done-well-excellent-editorial.jpg",
|
||||
|
|
@ -407,7 +421,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/useswr-react-hook-library-incremental-static-regeneration-nextjs/",
|
||||
"publishedOn": "2021-09-09T10:30:00.000Z",
|
||||
"wordCount": 2059,
|
||||
"wordCount": 2055,
|
||||
"title": "Using SWR React Hooks With Next.js’ Incremental Static Regeneration (ISR)",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/47c6e5fc-73b3-41fe-afb7-b640b860efa0/useswr-react-hook-library-incremental-static-regeneration-nextjs.jpg",
|
||||
|
|
@ -421,7 +435,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/developer-decisions-building-flexible-components/",
|
||||
"publishedOn": "2021-09-08T10:30:00.000Z",
|
||||
"wordCount": 2853,
|
||||
"wordCount": 2855,
|
||||
"title": "Developer Decisions For Building Flexible Components",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/76d3eef0-2a0a-45e0-b0bb-399da37c3834/developer-decisions-building-flexible-components.jpg",
|
||||
|
|
@ -449,7 +463,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/devtools-cross-browser-edition/",
|
||||
"publishedOn": "2021-09-07T10:00:00.000Z",
|
||||
"wordCount": 4036,
|
||||
"wordCount": 4047,
|
||||
"title": "What’s New With DevTools: Cross-Browser Edition",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/1e0eef0e-e4b0-45b6-8afd-1d1a60b7c53b/devtools-cross-browsers.jpg",
|
||||
|
|
@ -463,7 +477,7 @@
|
|||
"description": "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.",
|
||||
"link": "https://smashingmagazine.com/2021/09/http3-practical-deployment-options-part3/",
|
||||
"publishedOn": "2021-09-06T11:00:00.000Z",
|
||||
"wordCount": 9719,
|
||||
"wordCount": 9716,
|
||||
"title": "HTTP/3: Practical Deployment Options (Part 3)",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/a19cca97-b411-44a6-a8be-e1468a0df78a/http3-practical-deployment-options-part3.jpg",
|
||||
|
|
@ -477,7 +491,7 @@
|
|||
"description": "Websites, unfortunately, aren’t as environmentally friendly as we might like them to be. This article contains some thoughts and experiences from trying to clean them up.",
|
||||
"link": "https://smashingmagazine.com/2021/09/reducing-carbon-emissions-on-web/",
|
||||
"publishedOn": "2021-09-03T11:30:00.000Z",
|
||||
"wordCount": 3567,
|
||||
"wordCount": 3569,
|
||||
"title": "Reducing Carbon Emissions On The Web",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/bdef7e38-4e37-4177-a7b3-d74860c7724f/reducing-carbon-emissions-on-web.jpg",
|
||||
|
|
@ -491,7 +505,7 @@
|
|||
"description": "Interactive coding tools to help you learn CSS, JavaScript, SQL, React, Vim, regular expressions and Jamstack.",
|
||||
"link": "https://smashingmagazine.com/2021/09/interactive-learning-tools-front-end-developers/",
|
||||
"publishedOn": "2021-09-02T12:00:00.000Z",
|
||||
"wordCount": 2422,
|
||||
"wordCount": 2420,
|
||||
"title": "Interactive Learning Tools For Front-End Developers",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/7f13aec3-8dd5-4085-afce-c752db3abfb6/interactive-learning-tools-front-end-developers.jpg",
|
||||
|
|
@ -505,7 +519,7 @@
|
|||
"description": "What exactly is a displacement filter? In this article, Dirk Weber explains the SVG `feDisplacementMap` filter primitive with a good number of examples to demonstrate the concept of animated displacement maps.",
|
||||
"link": "https://smashingmagazine.com/2021/09/deep-dive-wonderful-world-svg-displacement-filtering/",
|
||||
"publishedOn": "2021-09-01T10:30:00.000Z",
|
||||
"wordCount": 5570,
|
||||
"wordCount": 5578,
|
||||
"title": "A Deep Dive Into The Wonderful World Of SVG Displacement Filtering",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/92af7db6-94b4-4e48-8e20-875af2d5e024/deep-dive-svg-displacement-filtering.jpg",
|
||||
|
|
@ -526,20 +540,6 @@
|
|||
"length": "0",
|
||||
"type": "image/jpg"
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "https://smashingmagazine.com/2021/08/desktop-wallpaper-calendars-september-2021/",
|
||||
"author": "hello@smashingmagazine.com (Cosima Mielke)",
|
||||
"description": "New month, new wallpapers! In this post, you’ll find inspiring wallpaper designs for September 2021. They were created with love by artists and designers from across the globe and are available with and without a calendar. Enjoy!",
|
||||
"link": "https://smashingmagazine.com/2021/08/desktop-wallpaper-calendars-september-2021/",
|
||||
"publishedOn": "2021-08-31T08:00:00.000Z",
|
||||
"wordCount": 2392,
|
||||
"title": "Stories Of September (2021 Desktop Wallpapers Edition)",
|
||||
"enclosure": {
|
||||
"url": "http://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/bdfaaaac-a4fb-475b-997c-ac45db998da0/sep-21-finding-the-balance-preview-opt.png",
|
||||
"length": "0",
|
||||
"type": "image/png"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
@ -548,6 +548,33 @@
|
|||
"feedUrl": "https://www.freecodecamp.org/news/rss/",
|
||||
"siteUrl": "https://www.freecodecamp.org/news",
|
||||
"articles": [
|
||||
{
|
||||
"id": "612cbfe4b5177808226d4a4b",
|
||||
"author": null,
|
||||
"description": "In SQL, there are two built-in functions to sum or average the data in your table. In this article I will show you how to use the SUM and AVG functions in SQL using code examples. How to use the SUM function in SQLIf you need to add a group",
|
||||
"link": "https://www.freecodecamp.org/news/sql-count-how-to-select-sum-and-average-rows-in-sql/",
|
||||
"publishedOn": "2021-09-29T20:04:04.000Z",
|
||||
"wordCount": 845,
|
||||
"title": "SQL Count – How to Select, Sum, and Average Rows in SQL"
|
||||
},
|
||||
{
|
||||
"id": "615440ac64aefe07d3fa0855",
|
||||
"author": null,
|
||||
"description": "You can use HTML, CSS and JavaScript to create stylish and dynamic web elements. And one useful element you can build is an accordion menu. Accordion menus expand and collapse when a user clicks a button. It's a great way to not have to show all the info about a",
|
||||
"link": "https://www.freecodecamp.org/news/build-an-accordion-menu-using-html-css-and-javascript/",
|
||||
"publishedOn": "2021-09-29T19:45:33.000Z",
|
||||
"wordCount": 1718,
|
||||
"title": "How to Build an Accordion Menu Using HTML, CSS and JavaScript"
|
||||
},
|
||||
{
|
||||
"id": "6154412664aefe07d3fa085b",
|
||||
"author": null,
|
||||
"description": "In this article, you'll learn how to add single and multi-line comments to your HTML documents. You'll also see why comments are considered a good practice when writing HTML code. Let's get started! The HTML Comment Tag The general syntax for an HTML comment looks like this: <!-- I",
|
||||
"link": "https://www.freecodecamp.org/news/html-comment-how-to-comment-out-a-line-or-tag-in-html/",
|
||||
"publishedOn": "2021-09-29T17:03:35.000Z",
|
||||
"wordCount": 1170,
|
||||
"title": "HTML Comment – How to Comment Out a Line or Tag in HTML"
|
||||
},
|
||||
{
|
||||
"id": "614e7e50ccc97307eb2bc3e5",
|
||||
"author": null,
|
||||
|
|
@ -610,33 +637,6 @@
|
|||
"publishedOn": "2021-09-27T21:04:00.000Z",
|
||||
"wordCount": 7670,
|
||||
"title": "All Emojis – Emoji List for Copy and Paste"
|
||||
},
|
||||
{
|
||||
"id": "6148802f9456b407b870f041",
|
||||
"author": null,
|
||||
"description": "There are many articles about the Open-Closed Principle, but I can never find one that explains it in a way that really works for me. So here, hopefully, is a good one – with a non trivial and real life example, what changes to support, and a description of the trade",
|
||||
"link": "https://www.freecodecamp.org/news/open-closed-principle/",
|
||||
"publishedOn": "2021-09-27T19:43:06.000Z",
|
||||
"wordCount": 1607,
|
||||
"title": "Open-Closed Principle – The Software Development Concept Explained in Plain English"
|
||||
},
|
||||
{
|
||||
"id": "61508279ccc97307eb2bca3f",
|
||||
"author": null,
|
||||
"description": "Sharing your knowledge can help you improve your skills and level up your career as a developer. Many developers are already doing it, and if you aren't, this article is for you. In it, I will show you why you should share your coding expertise by looking at five extraordinary",
|
||||
"link": "https://www.freecodecamp.org/news/why-you-should-share-your-knowledge-as-a-developer/",
|
||||
"publishedOn": "2021-09-27T17:41:26.000Z",
|
||||
"wordCount": 969,
|
||||
"title": "Why You Should Share Your Knowledge as a Developer"
|
||||
},
|
||||
{
|
||||
"id": "613f3cd3852f4307d372c7e8",
|
||||
"author": null,
|
||||
"description": "If you have just started learning JavaScript, you might have heard of the DOM. But what is it exactly? In this article, I will explain what the DOM is and provide some JavaScript code examples. We will take a look at how to select elements from an HTML document, how",
|
||||
"link": "https://www.freecodecamp.org/news/what-is-the-dom-document-object-model-meaning-in-javascript/",
|
||||
"publishedOn": "2021-09-27T16:23:19.000Z",
|
||||
"wordCount": 1470,
|
||||
"title": "What is the DOM? Document Object Model Meaning in JavaScript"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
130
feed.atom
130
feed.atom
|
|
@ -1,10 +1,72 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<feed xmlns="http://www.w3.org/2005/Atom">
|
||||
<id>urn:2021-09-29T00:40:45.148Z</id>
|
||||
<id>urn:2021-09-30T00:47:08.483Z</id>
|
||||
<title>osmos::feed</title>
|
||||
<updated>2021-09-29T00:40:45.148Z</updated>
|
||||
<updated>2021-09-30T00:47:08.483Z</updated>
|
||||
<generator>osmosfeed 1.11.2</generator>
|
||||
<link rel="alternate" href="index.html"/>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[SQL Count – How to Select, Sum, and Average Rows in SQL]]></title>
|
||||
<id>612cbfe4b5177808226d4a4b</id>
|
||||
<link href="https://www.freecodecamp.org/news/sql-count-how-to-select-sum-and-average-rows-in-sql/"/>
|
||||
<updated>2021-09-29T20:04:04.000Z</updated>
|
||||
<summary type="html"><![CDATA[In SQL, there are two built-in functions to sum or average the data in your table. In this article I will show you how to use the SUM and AVG functions in SQL using code examples. How to use the SUM function in SQLIf you need to add a group]]></summary>
|
||||
<author>
|
||||
<name>freeCodeCamp.org</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[How to Build an Accordion Menu Using HTML, CSS and JavaScript]]></title>
|
||||
<id>615440ac64aefe07d3fa0855</id>
|
||||
<link href="https://www.freecodecamp.org/news/build-an-accordion-menu-using-html-css-and-javascript/"/>
|
||||
<updated>2021-09-29T19:45:33.000Z</updated>
|
||||
<summary type="html"><![CDATA[You can use HTML, CSS and JavaScript to create stylish and dynamic web elements. And one useful element you can build is an accordion menu. Accordion menus expand and collapse when a user clicks a button. It's a great way to not have to show all the info about a]]></summary>
|
||||
<author>
|
||||
<name>freeCodeCamp.org</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[HTML Comment – How to Comment Out a Line or Tag in HTML]]></title>
|
||||
<id>6154412664aefe07d3fa085b</id>
|
||||
<link href="https://www.freecodecamp.org/news/html-comment-how-to-comment-out-a-line-or-tag-in-html/"/>
|
||||
<updated>2021-09-29T17:03:35.000Z</updated>
|
||||
<summary type="html"><![CDATA[In this article, you'll learn how to add single and multi-line comments to your HTML documents. You'll also see why comments are considered a good practice when writing HTML code. Let's get started! The HTML Comment Tag The general syntax for an HTML comment looks like this: <!-- I]]></summary>
|
||||
<author>
|
||||
<name>freeCodeCamp.org</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[Web Streams Everywhere (and Fetch for Node.js)]]></title>
|
||||
<id>https://css-tricks.com/?p=352723</id>
|
||||
<link href="https://css-tricks.com/web-streams-everywhere-and-fetch-for-node-js/"/>
|
||||
<updated>2021-09-29T14:51:25.000Z</updated>
|
||||
<summary type="html"><![CDATA[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.]]></summary>
|
||||
<author>
|
||||
<name>Ollie Williams</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[Front-End Dev Shortcuts in iOS 15]]></title>
|
||||
<id>https://css-tricks.com/?p=352627</id>
|
||||
<link href="https://css-tricks.com/front-end-dev-shortcuts-in-ios-15/"/>
|
||||
<updated>2021-09-29T14:51:22.000Z</updated>
|
||||
<summary type="html"><![CDATA[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.]]></summary>
|
||||
<author>
|
||||
<name>Geoff Graham</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[Using Modern Image Formats: AVIF And WebP]]></title>
|
||||
<id>https://smashingmagazine.com/2021/09/modern-image-formats-avif-webp/</id>
|
||||
<link href="https://smashingmagazine.com/2021/09/modern-image-formats-avif-webp/"/>
|
||||
<updated>2021-09-29T08:25:00.000Z</updated>
|
||||
<summary type="html"><![CDATA[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.]]></summary>
|
||||
<author>
|
||||
<name>hello@smashingmagazine.com (Addy Osmani)</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[CSS Flexbox Tutorial – How to Build a Fixed Side and Bottom Navbar]]></title>
|
||||
<id>614e7e50ccc97307eb2bc3e5</id>
|
||||
|
|
@ -18,7 +80,7 @@
|
|||
<entry>
|
||||
<title type="html"><![CDATA[So many little design helper sites!]]></title>
|
||||
<id>https://css-tricks.com/?p=352669</id>
|
||||
<link href="https://css-tricks.com/__trashed/"/>
|
||||
<link href="https://css-tricks.com/so-many-little-design-helper-sites/"/>
|
||||
<updated>2021-09-28T21:00:04.000Z</updated>
|
||||
<summary type="html"><![CDATA[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.
|
||||
|
||||
|
|
@ -122,16 +184,6 @@ The post Web Unleashed is Back! (Use Coupon Code “CSS-Tricks” for 50% Off) a
|
|||
<name>freeCodeCamp.org</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[Open-Closed Principle – The Software Development Concept Explained in Plain English]]></title>
|
||||
<id>6148802f9456b407b870f041</id>
|
||||
<link href="https://www.freecodecamp.org/news/open-closed-principle/"/>
|
||||
<updated>2021-09-27T19:43:06.000Z</updated>
|
||||
<summary type="html"><![CDATA[There are many articles about the Open-Closed Principle, but I can never find one that explains it in a way that really works for me. So here, hopefully, is a good one – with a non trivial and real life example, what changes to support, and a description of the trade]]></summary>
|
||||
<author>
|
||||
<name>freeCodeCamp.org</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[Tonic (Component Framework)]]></title>
|
||||
<id>https://css-tricks.com/?p=352621</id>
|
||||
|
|
@ -143,26 +195,6 @@ The post Tonic (Component Framework) appeared first on CSS-Tricks. You can suppo
|
|||
<name>Chris Coyier</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[Why You Should Share Your Knowledge as a Developer]]></title>
|
||||
<id>61508279ccc97307eb2bca3f</id>
|
||||
<link href="https://www.freecodecamp.org/news/why-you-should-share-your-knowledge-as-a-developer/"/>
|
||||
<updated>2021-09-27T17:41:26.000Z</updated>
|
||||
<summary type="html"><![CDATA[Sharing your knowledge can help you improve your skills and level up your career as a developer. Many developers are already doing it, and if you aren't, this article is for you. In it, I will show you why you should share your coding expertise by looking at five extraordinary]]></summary>
|
||||
<author>
|
||||
<name>freeCodeCamp.org</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[What is the DOM? Document Object Model Meaning in JavaScript]]></title>
|
||||
<id>613f3cd3852f4307d372c7e8</id>
|
||||
<link href="https://www.freecodecamp.org/news/what-is-the-dom-document-object-model-meaning-in-javascript/"/>
|
||||
<updated>2021-09-27T16:23:19.000Z</updated>
|
||||
<summary type="html"><![CDATA[If you have just started learning JavaScript, you might have heard of the DOM. But what is it exactly? In this article, I will explain what the DOM is and provide some JavaScript code examples. We will take a look at how to select elements from an HTML document, how]]></summary>
|
||||
<author>
|
||||
<name>freeCodeCamp.org</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[Collecting Email Signups With the Notion API]]></title>
|
||||
<id>https://css-tricks.com/?p=352211</id>
|
||||
|
|
@ -321,17 +353,6 @@ The post Container Units Should Be Pretty Handy appeared first on CSS-Tricks. Yo
|
|||
<name>Chris Coyier</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[Twitter’s div Soup and Uglyfied CSS, Explained]]></title>
|
||||
<id>https://css-tricks.com/?p=352388</id>
|
||||
<link href="https://giuseppegurgone.com/twitter-html/"/>
|
||||
<updated>2021-09-22T21:09:12.000Z</updated>
|
||||
<summary type="html"><![CDATA[When I came up in web development (2005-2010 were formative years for me), one of the first lessons I learned was to have a clean foundation of HTML. “What Beautiful HTML Code Looks Like” is actually one of the most …
|
||||
The post Twitter’s div Soup and Uglyfied CSS, Explained appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.]]></summary>
|
||||
<author>
|
||||
<name>Chris Coyier</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[Getting Your `head` Straight: A New CSS Performance Diagnostics Snippet]]></title>
|
||||
<id>https://smashingmagazine.com/2021/09/css-head-tag/</id>
|
||||
|
|
@ -342,17 +363,6 @@ The post Twitter’s div Soup and Uglyfied CSS, Explained appeared first on CSS-
|
|||
<name>hello@smashingmagazine.com (Vitaly Friedman)</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[How to Implement Logging in a Node.js Application With Pino-logger]]></title>
|
||||
<id>https://css-tricks.com/?p=352074</id>
|
||||
<link href="https://css-tricks.com/how-to-implement-logging-in-a-node-js-application-with-pino-logger/"/>
|
||||
<updated>2021-09-22T14:33:10.000Z</updated>
|
||||
<summary type="html"><![CDATA[Logging, on its own, is a key aspect of any application. Logging helps developers comprehend what it is that their code is doing. It also helps save developers hours of debugging work. This tutorial is about implementing logging in a …
|
||||
The post How to Implement Logging in a Node.js Application With Pino-logger appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.]]></summary>
|
||||
<author>
|
||||
<name>Sarthak Duggal</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[How To Build Your Own Mouseless Development Environment]]></title>
|
||||
<id>https://smashingmagazine.com/2021/09/mouseless-development-environment/</id>
|
||||
|
|
@ -554,14 +564,4 @@ Thank you @ad-m]]></summary>
|
|||
<name>hello@smashingmagazine.com (Átila Fassina)</name>
|
||||
</author>
|
||||
</entry>
|
||||
<entry>
|
||||
<title type="html"><![CDATA[Stories Of September (2021 Desktop Wallpapers Edition)]]></title>
|
||||
<id>https://smashingmagazine.com/2021/08/desktop-wallpaper-calendars-september-2021/</id>
|
||||
<link href="https://smashingmagazine.com/2021/08/desktop-wallpaper-calendars-september-2021/"/>
|
||||
<updated>2021-08-31T08:00:00.000Z</updated>
|
||||
<summary type="html"><![CDATA[New month, new wallpapers! In this post, you’ll find inspiring wallpaper designs for September 2021. They were created with love by artists and designers from across the globe and are available with and without a calendar. Enjoy!]]></summary>
|
||||
<author>
|
||||
<name>hello@smashingmagazine.com (Cosima Mielke)</name>
|
||||
</author>
|
||||
</entry>
|
||||
</feed>
|
||||
171
index.html
171
index.html
|
|
@ -15,6 +15,97 @@
|
|||
|
||||
<body>
|
||||
<!-- %after-body-begin.html% -->
|
||||
<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">(7 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">(3 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.freecodecamp.org/news">freeCodeCamp.org</a></h3>
|
||||
<section class="articles-per-source">
|
||||
<article>
|
||||
<details class="article-expander">
|
||||
<summary class="article-expander__title">SQL Count – How to Select, Sum, and Average Rows in SQL</summary>
|
||||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/sql-count-how-to-select-sum-and-average-rows-in-sql/">
|
||||
<div class="article-summary-box-inner">
|
||||
<span class="article-reading-time">(3 min)</span>
|
||||
<span>In SQL, there are two built-in functions to sum or average the data in your table. In this article I will show you how to use the SUM and AVG functions in SQL using code examples. How to use the SUM function in SQLIf you need to add a group</span>
|
||||
</div>
|
||||
</a>
|
||||
</details>
|
||||
</article>
|
||||
<article>
|
||||
<details class="article-expander">
|
||||
<summary class="article-expander__title">How to Build an Accordion Menu Using HTML, CSS and JavaScript</summary>
|
||||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/build-an-accordion-menu-using-html-css-and-javascript/">
|
||||
<div class="article-summary-box-inner">
|
||||
<span class="article-reading-time">(6 min)</span>
|
||||
<span>You can use HTML, CSS and JavaScript to create stylish and dynamic web elements. And one useful element you can build is an accordion menu. Accordion menus expand and collapse when a user clicks a button. It's a great way to not have to show all the info about a</span>
|
||||
</div>
|
||||
</a>
|
||||
</details>
|
||||
</article>
|
||||
<article>
|
||||
<details class="article-expander">
|
||||
<summary class="article-expander__title">HTML Comment – How to Comment Out a Line or Tag in HTML</summary>
|
||||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/html-comment-how-to-comment-out-a-line-or-tag-in-html/">
|
||||
<div class="article-summary-box-inner">
|
||||
<span class="article-reading-time">(4 min)</span>
|
||||
<span>In this article, you'll learn how to add single and multi-line comments to your HTML documents. You'll also see why comments are considered a good practice when writing HTML code. Let's get started! The HTML Comment Tag The general syntax for an HTML comment looks like this: <!-- I</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">
|
||||
|
|
@ -25,7 +116,7 @@
|
|||
<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/__trashed/">
|
||||
<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.
|
||||
|
|
@ -41,7 +132,7 @@ The post So many little design helper sites! appeared first on CSS-Tricks. You c
|
|||
<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">(5 min)</span>
|
||||
<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>
|
||||
|
|
@ -183,7 +274,7 @@ The post Tonic (Component Framework) appeared first on CSS-Tricks. You can suppo
|
|||
<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">(13 min)</span>
|
||||
<span class="article-reading-time">(14 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>
|
||||
|
|
@ -207,39 +298,6 @@ The post Collecting Email Signups With the Notion API appeared first on CSS-Tric
|
|||
</a>
|
||||
</details>
|
||||
</article>
|
||||
<article>
|
||||
<details class="article-expander">
|
||||
<summary class="article-expander__title">Open-Closed Principle – The Software Development Concept Explained in Plain English</summary>
|
||||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/open-closed-principle/">
|
||||
<div class="article-summary-box-inner">
|
||||
<span class="article-reading-time">(5 min)</span>
|
||||
<span>There are many articles about the Open-Closed Principle, but I can never find one that explains it in a way that really works for me. So here, hopefully, is a good one – with a non trivial and real life example, what changes to support, and a description of the trade</span>
|
||||
</div>
|
||||
</a>
|
||||
</details>
|
||||
</article>
|
||||
<article>
|
||||
<details class="article-expander">
|
||||
<summary class="article-expander__title">Why You Should Share Your Knowledge as a Developer</summary>
|
||||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/why-you-should-share-your-knowledge-as-a-developer/">
|
||||
<div class="article-summary-box-inner">
|
||||
<span class="article-reading-time">(3 min)</span>
|
||||
<span>Sharing your knowledge can help you improve your skills and level up your career as a developer. Many developers are already doing it, and if you aren't, this article is for you. In it, I will show you why you should share your coding expertise by looking at five extraordinary</span>
|
||||
</div>
|
||||
</a>
|
||||
</details>
|
||||
</article>
|
||||
<article>
|
||||
<details class="article-expander">
|
||||
<summary class="article-expander__title">What is the DOM? Document Object Model Meaning in JavaScript</summary>
|
||||
<a class="article-summary-link article-summary-box-outer" href="https://www.freecodecamp.org/news/what-is-the-dom-document-object-model-meaning-in-javascript/">
|
||||
<div class="article-summary-box-inner">
|
||||
<span class="article-reading-time">(5 min)</span>
|
||||
<span>If you have just started learning JavaScript, you might have heard of the DOM. But what is it exactly? In this article, I will explain what the DOM is and provide some JavaScript code examples. We will take a look at how to select elements from an HTML document, how</span>
|
||||
</div>
|
||||
</a>
|
||||
</details>
|
||||
</article>
|
||||
</section>
|
||||
</li>
|
||||
<li class="source">
|
||||
|
|
@ -251,7 +309,7 @@ The post Collecting Email Signups With the Notion API appeared first on CSS-Tric
|
|||
<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 class="article-reading-time">(16 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>
|
||||
|
|
@ -325,7 +383,7 @@ The post The Self Provisioning Runtime appeared first on CSS-Tricks. You can sup
|
|||
<summary class="article-expander__title">Comparing Methods for Appending and Inserting With JavaScript</summary>
|
||||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/comparing-methods-for-appending-and-inserting-with-javascript/">
|
||||
<div class="article-summary-box-inner">
|
||||
<span class="article-reading-time">(8 min)</span>
|
||||
<span class="article-reading-time">(9 min)</span>
|
||||
<span>Let’s say we want to add something to a webpage after the initial load. JavaScript gives us a variety of tools. Perhaps you’ve used some of them, like append, appendChild, insertAdjacentHTML, or innerHTML.
|
||||
The difficult thing …
|
||||
The post Comparing Methods for Appending and Inserting With JavaScript appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.</span>
|
||||
|
|
@ -463,30 +521,6 @@ The post Container Units Should Be Pretty Handy appeared first on CSS-Tricks. Yo
|
|||
</a>
|
||||
</details>
|
||||
</article>
|
||||
<article>
|
||||
<details class="article-expander">
|
||||
<summary class="article-expander__title">Twitter’s div Soup and Uglyfied CSS, Explained</summary>
|
||||
<a class="article-summary-link article-summary-box-outer" href="https://giuseppegurgone.com/twitter-html/">
|
||||
<div class="article-summary-box-inner">
|
||||
<span class="article-reading-time">(4 min)</span>
|
||||
<span>When I came up in web development (2005-2010 were formative years for me), one of the first lessons I learned was to have a clean foundation of HTML. “What Beautiful HTML Code Looks Like” is actually one of the most …
|
||||
The post Twitter’s div Soup and Uglyfied CSS, Explained 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">How to Implement Logging in a Node.js Application With Pino-logger</summary>
|
||||
<a class="article-summary-link article-summary-box-outer" href="https://css-tricks.com/how-to-implement-logging-in-a-node-js-application-with-pino-logger/">
|
||||
<div class="article-summary-box-inner">
|
||||
<span class="article-reading-time">(8 min)</span>
|
||||
<span>Logging, on its own, is a key aspect of any application. Logging helps developers comprehend what it is that their code is doing. It also helps save developers hours of debugging work. This tutorial is about implementing logging in a …
|
||||
The post How to Implement Logging in a Node.js Application With Pino-logger 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">
|
||||
|
|
@ -907,24 +941,13 @@ Thank you @ad-m</span>
|
|||
</a>
|
||||
</details>
|
||||
</article>
|
||||
<article>
|
||||
<details class="article-expander">
|
||||
<summary class="article-expander__title">Stories Of September (2021 Desktop Wallpapers Edition)</summary>
|
||||
<a class="article-summary-link article-summary-box-outer" href="https://smashingmagazine.com/2021/08/desktop-wallpaper-calendars-september-2021/">
|
||||
<div class="article-summary-box-inner">
|
||||
<span class="article-reading-time">(8 min)</span>
|
||||
<span>New month, new wallpapers! In this post, you’ll find inspiring wallpaper designs for September 2021. They were created with love by artists and designers from across the globe and are available with and without a calendar. Enjoy!</span>
|
||||
</div>
|
||||
</a>
|
||||
</details>
|
||||
</article>
|
||||
</section>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<footer>
|
||||
<time id="build-timestamp" datetime="2021-09-29T00:40:45.123Z">2021-09-29T00:40:45.123Z</time>
|
||||
<time id="build-timestamp" datetime="2021-09-30T00:47:08.468Z">2021-09-30T00:47:08.468Z</time>
|
||||
<span><a class="footer-link" href="https://github.com/osmoscraft/osmosfeed">osmosfeed 1.11.2</a></span>
|
||||
</footer>
|
||||
<script src="index.js"></script>
|
||||
|
|
|
|||
Loading…
Reference in a new issue