This is the source of stehil.com
This may be useful if you are building a React app and want to make it easy for Google Bot & friends to index your site - so you need SSR and good SEO. Otherwise use react-create-app.
The Stack
- React (with hooks - so much nicer than classes/recompose)
- TypeScript
- Razzle
- after.js
- react-router
- express
- SCSS
This stack is used here just for kicks, it's not needed for a static blog. Just a playground to try things out.
What this can do
- SSR
- code-splitting (async-loaded routes)
Why Razzle & after.js instead of next.js?
- Next gives you less freedom in what your URLs can look like by default.
- Next is a big library.
- Razzle's hot reloading is nicer than what you get with next.
- Disclaimer: I haven't tried Next v6/v7 properly, it should be lot better than the v4 I've used.
Why TypeScript
Yes, it's a bit of a pain to get it working right initially. Later on, it can be a head scratcher to get types working well, especially if you are going for maximum strictness™. But it's so worth it, especially if you are working in a team, or are a bit forgetful. Node.js with TypeScript is safer for me than Java ever was. Win!
Why SCSS
- CSS-in-JS solutions look nice. But they all increase bundle size and steal a bit of runtime performance.
- Yes, you're not getting guaranteed encapsulation with SCSS - but it's trivial to fix conflicting styles.
Troubleshooting
- Getting a weird Typescript error? It might just be an issue with Yarn or NPM. Try
rm -rf ./node_modules && rm yarn.lock && yarn
fseventsissue when running tests? Try expo/expo#854 (comment)