devlog: Improve my GatsbyJS-based website! Generate pages from an external data - Part.2/2

Hello. I'm Takuya Matsuyama from Japan, a solo developer making a Markdown note-taking app called Inkdrop. I'm making a comfortable earning from it now.
It's built with Electron and React.
In this video, I show my process of the work on improving the documentation website of Inkdrop, which is built with GatsbyJS.
I hope you enjoy it!

P.S. Sorry, the terminal font size was too small for watching the video. I'll make it 2x bigger from next shooting.

▶ Download my product - Inkdrop
https://www.inkdrop.app/?utm_source=devaslife&utm_medium=youtube&utm_campaign=vlog&utm_content=5N2T1N2VsRQ

Follow me online here:
▶ Discord community https://discord.gg/QfsG5Kj
▶ Twitter(English) https://twitter.com/inkdrop_app
▶ Twitter(日本語) https://twitter.com/craftzdog
▶ Instagram https://instagram.com/craftzdog
▶ Medium Blog https://blog.inkdrop.info/
▶ DEV blog https://dev.to/craftzdog
▶ GitHub https://github.com/craftzdog/
▶ Subscribe Newsletter https://www.devas.life/

Credits:
▶ BGM: Epidemic Sound https://www.epidemicsound.com/referral/p96aa8/

0:00 Helloooo
1:05 Convert Markdown into HTML using remerk
7:46 Refine the page text
9:19 Add a page stylesheet
11:35 Update the release notes index page to have links to the individual version
16:30 Load the version history data via StaticQuery
18:32 Struggling to get the version history data via GraphQL
19:23 Got the GraphQL query to work!
19:55 Refactoring the component
22:54 Fixing the component structures
24:43 Fix a react prop validations error
25:28 Tweak LESS stylesheets - Can't find where to edit
27:27 Getting a LESS compile error
29:31 Recap - What I've done today
32:31 Found that a link to the release notes page on sidebar disappeared
33:40 Sort the sidebar menu in alphabetical order
37:14 Getting another error
39:19 Recap - What I've done today (Again)
40:00 Deploy it on Netlify
40:57 It worked!!!!!

#javascript #vim #gatsbyjs

#Productivity #Solo dev #Programming #Indie dev #JavaScript #GatsbyJS #Web development #Front-end development #Freelacing