https://github.com/simbathesailor/server-side-reactjs
https://github.com/simbathesailor/server-side-reactjs
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/simbathesailor/server-side-reactjs
- Owner: simbathesailor
- Created: 2021-01-04T17:15:41.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2021-01-07T10:23:18.000Z (about 5 years ago)
- Last Synced: 2025-01-05T17:09:42.038Z (about 1 year ago)
- Language: JavaScript
- Size: 278 KB
- Stars: 1
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Procees Followed;
1. Went to babel website, because i know that to parse the jsx to js. I needed babel somehow.
2. The default suggestion is adding babel.config.json file having babel preset `@babel/env` which is same as `@babel/babel-reset-env` due to how these guys put up things in babel.
You can create preset using these kind of function :
```
module.exports = () => ({
presets: [
require("@babel/preset-env"),
],
plugins: [
[require("@babel/plugin-proposal-class-properties"), { loose: true }],
require("@babel/plugin-proposal-object-rest-spread"),
],
});
```
The these preset can contain another preset and also another plugin.
These plugins run from last to first.
But what plugins do ? Plugin are the way to modify the code in desired format using babel APIS, more on this later. babel gives you lot of utility to analyze the code and transform into someother formats.
Babel preset are the meat of logic where transformations happen. babel has alrady readymade preset made for common conversions
like @preset/react, @preset/typescript
WHat they do ? Go inside them and undesrtand it. SOmetime later i will see them on case to case basis.
// https://webpack.js.org/api/node/
// https://github.com/nodejs/node-eps/blob/master/002-es-modules.md#451-environment-variables
// https://2ality.com/2019/10/hybrid-npm-packages.html
https://www.digitalocean.com/community/tutorials/react-server-side-rendering#:~:text=Server%2Dside%20rendering%20(SSR),served%20as%20static%20HTML%20markup.
https://www.brettjankord.com/2020/09/21/how-to-inject-server-rendered-html-into-create-react-app-with-express/