From 0120bca092054db784679a39d806ad2ca875d17e Mon Sep 17 00:00:00 2001 From: chuanqisun Date: Thu, 22 Apr 2021 00:50:06 +0000 Subject: [PATCH] deploy: 93a47ca1ea00c4476b086318dc68b7b679ed4221 --- cache.json | 138 ++++++++++++++++++++++----------------- index.html | 186 ++++++++++++++++++++++++++++++++--------------------- 2 files changed, 191 insertions(+), 133 deletions(-) diff --git a/cache.json b/cache.json index 4aff18f..4716ef7 100644 --- a/cache.json +++ b/cache.json @@ -3,11 +3,38 @@ { "href": "https://css-tricks.com/feed/", "articles": [ + { + "description": "It sure would be nice to be able to animate the transition between pages if we want to on the web, at least without resorting to hacks or full-blown architecture choices just to achieve it. Some kind of API that …\nThe post Still Hoping for Better Native Page Transitions appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", + "link": "https://css-tricks.com/still-hoping-for-better-native-page-transitions/", + "publishedOn": "2021-04-21T22:57:03.000Z", + "wordCount": 811, + "sourceHref": "https://css-tricks.com/feed/", + "sourceTitle": "CSS-Tricks", + "title": "Still Hoping for Better Native Page Transitions" + }, + { + "description": "Page Laubheimer says that if you’re going to do a sticky header…\nKeep it small.\nVisually contrast it with the rest of the page.\nIf it’s going to move, keep it minimal. (I’d say, respect prefers-reduced-motion.)\nConsider “partially persistent \n…\nThe post Sticky Headers: 5 Ways to Make Them Better appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", + "link": "https://www.nngroup.com/articles/sticky-headers/", + "publishedOn": "2021-04-21T20:53:31.000Z", + "wordCount": 2358, + "sourceHref": "https://css-tricks.com/feed/", + "sourceTitle": "CSS-Tricks", + "title": "Sticky Headers: 5 Ways to Make Them Better" + }, + { + "description": "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 …\nThe post How to Add a Double Border to SVG Shapes appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", + "link": "https://css-tricks.com/how-to-add-a-double-border-to-svg-shapes/", + "publishedOn": "2021-04-21T14:26:28.000Z", + "wordCount": 1043, + "sourceHref": "https://css-tricks.com/feed/", + "sourceTitle": "CSS-Tricks", + "title": "How to Add a Double Border to SVG Shapes" + }, { "description": "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. …\nThe post Intrinsic Typography is the Future of Styling Text on the Web appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", "link": "https://css-tricks.com/intrinsic-typography-is-the-future-of-styling-text-on-the-web/", "publishedOn": "2021-04-20T14:24:44.000Z", - "wordCount": 1851, + "wordCount": 2618, "sourceHref": "https://css-tricks.com/feed/", "sourceTitle": "CSS-Tricks", "title": "Intrinsic Typography is the Future of Styling Text on the Web" @@ -16,7 +43,7 @@ "description": "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 …\nThe post Say Hello to CSS Container Queries appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", "link": "https://ishadeed.com/article/say-hello-to-css-container-queries/", "publishedOn": "2021-04-20T14:21:44.000Z", - "wordCount": 2219, + "wordCount": 2230, "sourceHref": "https://css-tricks.com/feed/", "sourceTitle": "CSS-Tricks", "title": "Say Hello to CSS Container Queries" @@ -34,7 +61,7 @@ "description": "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 …\nThe post Float an Element to the Bottom Corner appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", "link": "https://css-tricks.com/float-an-element-to-the-bottom-corner/", "publishedOn": "2021-04-19T14:17:49.000Z", - "wordCount": 1650, + "wordCount": 1863, "sourceHref": "https://css-tricks.com/feed/", "sourceTitle": "CSS-Tricks", "title": "Float an Element to the Bottom Corner" @@ -43,7 +70,7 @@ "description": "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 …\nThe post Creating an Editable Textarea That Supports Syntax-Highlighted Code appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", "link": "https://css-tricks.com/creating-an-editable-textarea-that-supports-syntax-highlighted-code/", "publishedOn": "2021-04-16T18:58:59.000Z", - "wordCount": 2698, + "wordCount": 2706, "sourceHref": "https://css-tricks.com/feed/", "sourceTitle": "CSS-Tricks", "title": "Creating an Editable Textarea That Supports Syntax-Highlighted Code" @@ -52,7 +79,7 @@ "description": "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 …\nThe post Platform News: Using :focus-visible, BBC’s New Typeface, Declarative Shadow DOMs, A11Y and Placeholders appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", "link": "https://css-tricks.com/platform-news-using-focus-visible-bbcs-new-typeface-declarative-shadow-doms-a11y-and-placeholders/", "publishedOn": "2021-04-16T14:33:05.000Z", - "wordCount": 1643, + "wordCount": 1648, "sourceHref": "https://css-tricks.com/feed/", "sourceTitle": "CSS-Tricks", "title": "Platform News: Using :focus-visible, BBC’s New Typeface, Declarative Shadow DOMs, A11Y and Placeholders" @@ -79,7 +106,7 @@ "description": "The title of this article is misleading. It’s not actually very important for an Engineering Manager to use career laddering, per se, or my process. It is, however, very important that an Engineering Manager is clear with their employees…\nThe post The Importance of Career Laddering appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", "link": "https://css-tricks.com/the-importance-of-career-laddering/", "publishedOn": "2021-04-15T14:29:18.000Z", - "wordCount": 2806, + "wordCount": 2840, "sourceHref": "https://css-tricks.com/feed/", "sourceTitle": "CSS-Tricks", "title": "The Importance of Career Laddering" @@ -110,39 +137,30 @@ "sourceHref": "https://css-tricks.com/feed/", "sourceTitle": "CSS-Tricks", "title": "Going “Meta GSAP”: The Quest for “Perfect” Infinite Scrolling" - }, - { - "description": "This Robin Sloan fella is an interesting character. Not only have I read his one of his fiction novels, the tremendous Mr. Penumbra’s 24‑Hour Bookstore, but I also use the olive oil he makes with partner Kathryn Tomajan. …\nThe post Cloud study appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", - "link": "https://society.robinsloan.com/archive/cloud-study/", - "publishedOn": "2021-04-13T22:49:41.000Z", - "wordCount": 791, - "sourceHref": "https://css-tricks.com/feed/", - "sourceTitle": "CSS-Tricks", - "title": "Cloud study" - }, - { - "description": "I think it’s fair to think of Netlify as a CDN-backed static file host. But it would also be silly to think that’s all it is. That’s why I think it’s smart for them to have pages like this, comparing …\nThe post Why Netlify? appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", - "link": "https://css-tricks.com/why-netlify/", - "publishedOn": "2021-04-13T22:48:59.000Z", - "wordCount": 484, - "sourceHref": "https://css-tricks.com/feed/", - "sourceTitle": "CSS-Tricks", - "title": "Why Netlify?" - }, - { - "description": "One of the ways you can classify a programming language is by how strongly or weakly typed it is. Here, “typed” means if variables are known at compile time. An example of this would be a scenario where an integer …\nThe post CSS is a Strongly Typed Language appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", - "link": "https://css-tricks.com/css-is-a-strongly-typed-language/", - "publishedOn": "2021-04-13T14:22:04.000Z", - "wordCount": 3102, - "sourceHref": "https://css-tricks.com/feed/", - "sourceTitle": "CSS-Tricks", - "title": "CSS is a Strongly Typed Language" } ] }, { "href": "https://www.smashingmagazine.com/feed/", "articles": [ + { + "description": "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.", + "link": "https://smashingmagazine.com/2021/04/incremental-static-regeneration-nextjs/", + "publishedOn": "2021-04-21T13:55:00.000Z", + "wordCount": 1929, + "sourceHref": "https://www.smashingmagazine.com/feed/", + "sourceTitle": "Articles on Smashing Magazine — For Web Designers And Developers", + "title": "A Complete Guide To Incremental Static Regeneration (ISR) With Next.js" + }, + { + "description": "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.", + "link": "https://smashingmagazine.com/2021/04/content-fundamental-part-web-design-process/", + "publishedOn": "2021-04-21T08:30:00.000Z", + "wordCount": 2998, + "sourceHref": "https://www.smashingmagazine.com/feed/", + "sourceTitle": "Articles on Smashing Magazine — For Web Designers And Developers", + "title": "Why Content Is Such A Fundamental Part Of The Web Design Process" + }, { "description": "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.", "link": "https://smashingmagazine.com/2021/04/making-graphql-work-in-wordpress/", @@ -355,6 +373,33 @@ { "href": "https://www.freecodecamp.org/news/rss/", "articles": [ + { + "description": "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", + "link": "https://www.freecodecamp.org/news/how-to-become-a-technical-writer/", + "publishedOn": "2021-04-21T20:06:00.000Z", + "wordCount": 2850, + "sourceHref": "https://www.freecodecamp.org/news/rss/", + "sourceTitle": "freeCodeCamp.org", + "title": "How to Become a Technical Writer" + }, + { + "description": "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", + "link": "https://www.freecodecamp.org/news/combine-first-last-names-excel/", + "publishedOn": "2021-04-21T19:16:31.000Z", + "wordCount": 530, + "sourceHref": "https://www.freecodecamp.org/news/rss/", + "sourceTitle": "freeCodeCamp.org", + "title": "How to Combine First and Last Name in Excel" + }, + { + "description": "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", + "link": "https://www.freecodecamp.org/news/how-to-auto-deploy-your-react-apps-with-cloudflare-pages/", + "publishedOn": "2021-04-21T18:26:44.000Z", + "wordCount": 1486, + "sourceHref": "https://www.freecodecamp.org/news/rss/", + "sourceTitle": "freeCodeCamp.org", + "title": "How to Auto-Deploy Your React Apps with Cloudflare Pages" + }, { "description": "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", "link": "https://www.freecodecamp.org/news/convert-html-to-pdf-with-azure-functions-and-wkhtmltopdf/", @@ -417,33 +462,6 @@ "sourceHref": "https://www.freecodecamp.org/news/rss/", "sourceTitle": "freeCodeCamp.org", "title": "SQL Case Statement Tutorial – With When-Then Clause Example Queries" - }, - { - "description": "If you need to know the number of words or characters in a Google Doc, it's easy to find out using the tools Google Docs itself offers you. Whether it's for a Google Doc or an imported Word file, it works the same way – and I'll show you how in", - "link": "https://www.freecodecamp.org/news/word-count-in-google-docs-tutorial-counting-words-and-characters-in-a-google-doc-or-word-file/", - "publishedOn": "2021-04-19T20:40:35.000Z", - "wordCount": 563, - "sourceHref": "https://www.freecodecamp.org/news/rss/", - "sourceTitle": "freeCodeCamp.org", - "title": "Word Count in Google Docs Tutorial – Counting Words and Characters in a Google Doc or Word File" - }, - { - "description": "There are a lot of tutorials about building clones of popular web apps but most of them are short and don't cover very many features. We just released a massive 12-hour course that will show you how to create your own version of Instagram. This course is a lot more", - "link": "https://www.freecodecamp.org/news/learn-how-to-create-an-instagram-clone-using-react/", - "publishedOn": "2021-04-19T20:34:31.000Z", - "wordCount": 649, - "sourceHref": "https://www.freecodecamp.org/news/rss/", - "sourceTitle": "freeCodeCamp.org", - "title": "Learn How to Create an Instagram Clone Using React in Free 12-Hour Course" - }, - { - "description": "Google Forms is a helpful tool that lets you create surveys with a great variety of customization options. In this guide we will see the most common ways to make and customize your own Google Form. Start from a templateWhen you're ready to create a new survey, you have the", - "link": "https://www.freecodecamp.org/news/how-to-make-a-google-form-survey-google-forms-tutorial/", - "publishedOn": "2021-04-19T18:13:00.000Z", - "wordCount": 1987, - "sourceHref": "https://www.freecodecamp.org/news/rss/", - "sourceTitle": "freeCodeCamp.org", - "title": "How to Make a Google Form Survey – Google Forms Tutorial" } ] } diff --git a/index.html b/index.html index 4e0119f..c0d1ef0 100644 --- a/index.html +++ b/index.html @@ -10,6 +10,117 @@ +
+

2021-04-21

+ +

CSS-Tricks

+
+ +
+
+ Still Hoping for Better Native Page Transitions +
+

It sure would be nice to be able to animate the transition between pages if we want to on the web, at least without resorting to hacks or full-blown architecture choices just to achieve it. Some kind of API that … +The post Still Hoping for Better Native Page Transitions appeared first on CSS-Tricks. +You can support CSS-Tricks by being an MVP Supporter.

+ Read · 3 min +
+
+
+ +
+
+ Sticky Headers: 5 Ways to Make Them Better +
+

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.

+ Read · 8 min +
+
+
+ +
+
+ How to Add a Double Border to SVG Shapes +
+

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.

+ Read · 3 min +
+
+
+
+ + +

freeCodeCamp.org

+
+ +
+
+ How to Become a Technical Writer +
+

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

+ Read · 10 min +
+
+
+ +
+
+ How to Combine First and Last Name in Excel +
+

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

+ Read · 2 min +
+
+
+ +
+
+ How to Auto-Deploy Your React Apps with Cloudflare Pages +
+

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

+ Read · 5 min +
+
+
+
+ + +

Articles on Smashing Magazine — For Web Designers And Developers

+
+ +
+
+ A Complete Guide To Incremental Static Regeneration (ISR) With Next.js +
+

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.

+ Read · 6 min +
+
+
+ +
+
+ Why Content Is Such A Fundamental Part Of The Web Design Process +
+

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.

+ Read · 10 min +
+
+
+
+ +
+ +

2021-04-20

@@ -38,7 +149,7 @@

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.

- Read · 6 min + Read · 9 min @@ -139,36 +250,6 @@ You can support CSS-Tricks by being an MVP Supporter.

- -
-
- Word Count in Google Docs Tutorial – Counting Words and Characters in a Google Doc or Word File -
-

If you need to know the number of words or characters in a Google Doc, it's easy to find out using the tools Google Docs itself offers you. Whether it's for a Google Doc or an imported Word file, it works the same way – and I'll show you how in

- Read · 2 min -
-
-
- -
-
- Learn How to Create an Instagram Clone Using React in Free 12-Hour Course -
-

There are a lot of tutorials about building clones of popular web apps but most of them are short and don't cover very many features. We just released a massive 12-hour course that will show you how to create your own version of Instagram. This course is a lot more

- Read · 2 min -
-
-
- -
-
- How to Make a Google Form Survey – Google Forms Tutorial -
-

Google Forms is a helpful tool that lets you create surveys with a great variety of customization options. In this guide we will see the most common ways to make and customize your own Google Form. Start from a templateWhen you're ready to create a new survey, you have the

- Read · 7 min -
-
-
@@ -408,47 +489,6 @@ You can support CSS-Tricks by being an MVP Supporter.

2021-04-13

-

CSS-Tricks

-
- -
-
- Cloud study -
-

This Robin Sloan fella is an interesting character. Not only have I read his one of his fiction novels, the tremendous Mr. Penumbra’s 24‑Hour Bookstore, but I also use the olive oil he makes with partner Kathryn Tomajan. … -The post Cloud study appeared first on CSS-Tricks. -You can support CSS-Tricks by being an MVP Supporter.

- Read · 3 min -
-
-
- -
-
- Why Netlify? -
-

I think it’s fair to think of Netlify as a CDN-backed static file host. But it would also be silly to think that’s all it is. That’s why I think it’s smart for them to have pages like this, comparing … -The post Why Netlify? appeared first on CSS-Tricks. -You can support CSS-Tricks by being an MVP Supporter.

- Read · 2 min -
-
-
- -
-
- CSS is a Strongly Typed Language -
-

One of the ways you can classify a programming language is by how strongly or weakly typed it is. Here, “typed” means if variables are known at compile time. An example of this would be a scenario where an integer … -The post CSS is a Strongly Typed Language appeared first on CSS-Tricks. -You can support CSS-Tricks by being an MVP Supporter.

- Read · 10 min -
-
-
-
- -

Articles on Smashing Magazine — For Web Designers And Developers

@@ -776,7 +816,7 @@ You can support CSS-Tricks by being an MVP Supporter.