DopamineDriven/wcd-ssg-antd

JAMstack, TypeScript, React, Nextjs, Vercel, Static Site Generation, Cloudinary, Graymatter, Remark (md to html)

wcd-ssg-antd 🐜🐜SSG🐜🐜BUILD🐜🐜🐜🐜

Browserl.ist - target browsers

• https://browserl.ist/?q=%3E0.3%25%2C+not+ie+11%2C+not+dead%2C+not+op_mini+all

CSS Modules - Code Splitting

• https://nextjs.org/blog/next-9-2

Antd layout breakpoint width

.breakpointWidth{
  xs: '480px';
  sm: '576px';
  md: '768px';
  lg: '992px';
  xl: '1200px';
  xxl: '1600px';
}

React Components - Foundation of Ant Design

• https://github.com/react-component

Transitions

• https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions

Default Antd styling by component

• https://github.com/ant-design/ant-design/blob/master/components/style/themes/default.less

generate JSX from .svg files via the command line

$ npx @svgr/cli --icon Logo.svg

• target the .svg file
• copy paste the output of the command line into a .tsx (or .jsx) file
• voila

[name].module.css - component level styles

• https://nextjs.org/blog/next-9-2#built-in-css-module-support-for-component-level-styles

Deep Dive - Rendering on the Web READ THIS → yes, the reader

• https://developers.google.com/web/updates/2019/02/rendering-on-the-web

Use less with antd

• https://ant.design/docs/react/customize-theme
• https://github.com/ant-design/ant-design/blob/master/components/style/themes/default.less
• https://annacoding.com/article/2cU5baQMXG8SV2pbxh7kO8/How-to-config-Ant-Design--in-Next.js-with-custom-theme?
• https://clrs.cc/

Next vs Gatsby vs CRApp

• https://leerob.io/blog/nextjs-gatsby-create-react-app