🎵 Note to self…
But lazy loading Ant Design (AntD, hereafter) components broke the custom CSS imported from the root component using CSS import.
I recently started contributing to an open source project, qit, which “let programmers find and listen to podcasts by topic“.
As I was going through issues to tackle to get started, I found out that many issues had just titles but no description of how to reproduce it or how the site should normally behave.
Thankfully, GitHub provides a way to encourage users for a better issue report.
After reading this great article Using SVG as placeholders — More Image Loading Techniques by José M. Pérez , I decided to show a lightweight SVG background and then load a full background image.
Here is a workaround I used to get around the flickering issue.
*UPDATE* – October 28, 2018
Refer to the updated post, Loading React Components Dynamically on Demand using React.lazy if you are using
switch statement when displaying React components.
Then I ran into a dynamic import().
I will show you 3 ways to use
import() to dynamically load React Components.
- Loading React Components Dynamically – Demo – Source Code
- Handling Different Data Types – Demo – Source Code
- Loading Components on Demand – Demo – Source Code
Let’s dive in 🏊~
As I was learning React, I’ve run into a situation where I needed to use node as a backend. I found this wonderful article Create React App with an Express Backend by Dave Ceddia.
But debugging required opening two command windows; One for node server, another for webpack dev server.
- SET PORT=3001 && node bin/www
- SET PORT=3000 && yarn start
Can we do better?
What was involved to solve the question without
Use a dictionary & a lambda expression
I solved a CodeWars (programming challenge site) question and compared my answer to other solutions.
I was introduced to a different way of solving a question with a boolean operation.
Be prepared to be blown away.
SPOILER ALERT!: Answers are shown below so proceed at your own discretion (or try to solve the question yourself first before proceeding to compare your answer)
You git cloned a repository from GitHub without forking it.
The problem is that you made a bunch of changes and want to publish it to a new GitHub repository.
What are the steps required to accomplish it?
Remove original remote and add your own
I was working on displaying multiple GitHub traffic charts using a Google Chart NPM package for React, react-google-charts.
Out of many charts, only the first one chart is populated.
How do we fix it?